diff options
author | vnugent <public@vaughnnugent.com> | 2024-01-20 23:49:29 -0500 |
---|---|---|
committer | vnugent <public@vaughnnugent.com> | 2024-01-20 23:49:29 -0500 |
commit | 6cb7da37824d02a1898d08d0f9495c77fde4dd1d (patch) | |
tree | 95e37ea3c20f416d6a205ee4ab050c307b18eafe /front-end/src/components/Login/PkiLogin.vue |
inital commit
Diffstat (limited to 'front-end/src/components/Login/PkiLogin.vue')
-rw-r--r-- | front-end/src/components/Login/PkiLogin.vue | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/front-end/src/components/Login/PkiLogin.vue b/front-end/src/components/Login/PkiLogin.vue new file mode 100644 index 0000000..26528c4 --- /dev/null +++ b/front-end/src/components/Login/PkiLogin.vue @@ -0,0 +1,50 @@ +<script setup lang="ts"> +import { isEmpty } from 'lodash-es'; +import { apiCall, debugLog, useMessage } from '@vnuge/vnlib.browser'; +import { ref } from 'vue' +import { decodeJwt } from 'jose' +import { useStore } from '../../store'; + +const { setMessage } = useMessage() +const { pkiAuth } = useStore() + +const otp = ref('') + +const onSubmit = () => { + + apiCall(async () => { + if (isEmpty(otp.value)) { + setMessage('Please enter your OTP') + return + } + try{ + //try to decode the jwt to confirm its form is valid + const jwt = decodeJwt(otp.value) + debugLog(jwt) + } + catch{ + setMessage('Your OTP is not valid') + return + } + await pkiAuth.login(otp.value) + }) +} +</script> + +<template> + <form id="pki-login-form" class="max-w-sm mx-auto" @submit.prevent="onSubmit"> + <label for="message" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white"> + Paste your one time password (OTP) + </label> + <textarea + id="message" rows="5" + v-model="otp" + class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" + placeholder="Enter your OTP" + > + </textarea> + + <button type="submit" for="pki-login-form" class="mt-4 btn">Submit</button> + + </form> +</template>
\ No newline at end of file |