login.vue 1.47 KB
<script setup lang="ts">
import { useKeycloakStore } from '@/@core/stores/keycloakStore'

import authLoginBg from '/assets/images/naput/bg-blue-yellow.png'
import authLoginLogo from '/assets/images/naput/illust-login.png'

import AuthProvider from '@/views/pages/authentication/AuthProvider.vue'

const authThemeImg = authLoginLogo

const authThemeBg = authLoginBg

const keycloakStore = useKeycloakStore()

definePageMeta({
  layout: 'blank',
  unauthenticatedOnly: true,

})
</script>

<template>
  <body
    :style="{ backgroundImage: `url(${authThemeBg})` }"
    class="body-2"
  >
    <section class="global-main-login-component">
      <div class="card-main-login-component4">
        <div class="logo-login-component4">
          <VImg
            :src="authThemeImg"
            max-width="650"
            max-height="300"
            class="image-10 lazyload"
          />
        </div>
        <div class="form-login-component">
          <VCol cols="12">
            <img
              src="/assets/images/naput/logo-ui-hitam.png"
              width="100"
              height="auto"
              class="mb-0"
            >
            <h4 class="text-h4 mb-1">
              Welcome 👋🏻 {{ keycloakStore.name }}
            </h4>
          </VCol>

          <VCol cols="12">
            <AuthProvider />
          </VCol>
        </div>
      </div>
    </section>
  </body>
  <!-- </VRow> -->
</template>

<style lang="scss">
@use "@core/scss/template/pages/page-auth";
</style>