49 lines
2.0 KiB
Vue
49 lines
2.0 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue';
|
|
const { $encodeBase64 } = useNuxtApp();
|
|
const checkbox = ref(true);
|
|
const cookies = useCookie('user_token_profile');
|
|
// const keycloak = async () => {
|
|
// const response = await $fetch(`/api/auth/login`, { method: 'POST', mode: 'no-cors' }).then((response) => {
|
|
// console.log(response)
|
|
// cookies.value = $encodeBase64('ini_token')
|
|
// window.location.href = response.callbackURL
|
|
// })
|
|
// }
|
|
|
|
const { signIn, getProviders } = useAuth()
|
|
const providers = await getProviders()
|
|
</script>
|
|
|
|
<template>
|
|
<v-row class="d-flex mb-3">
|
|
<v-col cols="12">
|
|
<v-label class="font-weight-bold mb-1">Username</v-label>
|
|
<v-text-field variant="outlined" density="compact" hide-details color="primary"></v-text-field>
|
|
</v-col>
|
|
<v-col cols="12">
|
|
<v-label class="font-weight-bold mb-1">Password</v-label>
|
|
<v-text-field variant="outlined" density="compact" type="password" hide-details
|
|
color="primary"></v-text-field>
|
|
</v-col>
|
|
<v-col cols="12" class="pt-0">
|
|
<div class="d-flex flex-wrap align-center">
|
|
<v-checkbox v-model="checkbox" color="primary" hide-details>
|
|
<template v-slot:label class="text-body-1">Remeber this Device</template>
|
|
</v-checkbox>
|
|
<div class="ml-sm-auto">
|
|
<NuxtLink to="/" class="text-primary text-decoration-none text-body-1 opacity-1 font-weight-medium">
|
|
Forgot
|
|
Password ?</NuxtLink>
|
|
</div>
|
|
</div>
|
|
</v-col>
|
|
<v-col cols="12" class="pt-0">
|
|
<button v-for="provider in providers" :key="provider.id" class="login-button" @click="signIn('keycloak')">
|
|
Sign in with {{ provider.name }}
|
|
</button>
|
|
<!-- <v-btn @click="keycloak()" color="primary" size="large" block flat>Sign in</v-btn> -->
|
|
</v-col>
|
|
</v-row>
|
|
</template>
|