update

app/components/app/auth/login.vue

@@ -13,6 +13,7 @@ const props = defineProps<Props>()
 
 const emit = defineEmits<{
   submit: [data: any]
+  sso: []
 }>()
 
 const { handleSubmit, defineField, errors, meta } = useForm({
@@ -33,6 +34,10 @@ const onSubmit = handleSubmit(async (values) => {
     console.error('Submission failed:', error)
   }
 })
+
+function onSSO() {
+  emit('sso')
+}
 </script>
 
 <template>
@@ -71,4 +76,8 @@ const onSubmit = handleSubmit(async (values) => {
       Login
     </Button>
   </form>
+
+  <Button @click="onSSO" target="_blank">
+    Login SSO
+  </Button>
 </template>

app/components/content/auth/login.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import { z } from 'zod'
+import Keycloak from 'keycloak-js'
+// import { useKeycloak } from '@/stores/keycloak'
 
 const loginSchema = z.object({
   name: z.string().min(3, 'Please enter a valid username'),
@@ -39,10 +41,75 @@ async function onSubmit(data: LoginFormData) {
 
   isLoading.value = false
 }
+
+const config = useRuntimeConfig()
+// const store = useKeycloak()
+
+const state = reactive({
+    loggedIn: false
+})
+
+async function onSSO() {
+  const config = useRuntimeConfig()
+
+  const initOptions = {
+      url: config.public.KEYCLOAK_URL,
+      realm: config.public.KEYCLOAK_REALM,
+      clientId: config.public.KEYCLOAK_ID,
+      onLoad: 'login-required'
+  }
+
+  const keycloak = new Keycloak(initOptions)
+  keycloak
+      .init({ onLoad: initOptions.onLoad })
+      .then((auth) => {
+          if (!auth) {
+              window.location.reload()
+          } else {
+              // store.setup(keycloak)
+              state.loggedIn = true
+          }
+      })
+
+  if (state.loggedIn) {
+    const result = await xfetch('/api/v1/authentication/login-fes', 'POST', {
+      data: keycloak,
+    })
+
+    if (result.success) {
+      const { data: rawdata, meta } = result.body
+      if (meta.status === 'verified') {
+        login(rawdata)
+        navigateTo('/')
+      }
+    } else {
+      if (result.errors) {
+        Object.entries(result.errors).forEach(
+          ([field, errorInfo]: [string, any]) => (apiErrors.value[field] = errorInfo.message),
+        )
+      } else {
+        apiErrors.value.general = result.error?.message || result.message || 'Login failed'
+      }
+    }
+  }
+
+  // const urlSSO =
+  //   config.public.KEYCLOAK_ISSUER +
+  //   '/protocol/openid-connect/auth?client_id=' +
+  //   config.public.KEYCLOAK_ID +
+  //   '&scope=openid%20email%20profile&response_type=code&redirect_uri=' +
+  //   config.public.KEYCLOAK_LOGOUT_REDIRECT +
+  //   '%2Fapi%2Fauth%2Fcallback%2Fkeycloak&state=AKf-WHWdL822V3LaNS5MSFzJ96-VHp6FUXlXxIAzXXM&code_challenge=nXOcGLLlA1NtXI4RM4hL59iP_I_yQAsUDd5sAOkKBF4&code_challenge_method=S256'
+  // await navigateTo(urlSSO,
+  // {
+  //   open: { target: '_blank' },
+  //   external: true
+  // })
+}
 </script>
 
 <template>
-  <AppAuthLogin :schema="loginSchema" :is-loading="isLoading" @submit="onSubmit" />
+  <AppAuthLogin :schema="loginSchema" :is-loading="isLoading" @submit="onSubmit" @sso="onSSO" />
 </template>
 
 <style scoped></style>