mirror of
https://github.com/ThisIsBenny/wishlist-app.git
synced 2025-06-07 05:57:41 +00:00
58 lines
1.5 KiB
Vue
58 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import { useRouter } from 'vue-router'
|
|
import { useI18n } from 'vue-i18n'
|
|
import { Form } from 'vee-validate'
|
|
import { object, string } from 'yup'
|
|
import { useAuth } from '@/composables'
|
|
import { IconLogin } from '@/components/icons'
|
|
import { ButtonBase } from '@/components'
|
|
import InputText from '@/components/InputText.vue'
|
|
|
|
const router = useRouter()
|
|
const { setToken } = useAuth()
|
|
|
|
const { t } = useI18n()
|
|
|
|
const schema = object({
|
|
'api-key': string().required(
|
|
t('pages.login-view.main.form.api-key.error-requried')
|
|
),
|
|
})
|
|
|
|
const onSubmit = (values: any): void => {
|
|
setToken(values['api-key'])
|
|
router.push('/')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex h-full">
|
|
<div
|
|
class="m-auto w-1/2 rounded-md border-2 border-stone-200 px-6 py-10 dark:border-stone-700"
|
|
>
|
|
<h1 class="text-semibold mb-8 text-center text-3xl">
|
|
{{ t('pages.login-view.main.title.text') }}
|
|
</h1>
|
|
<Form
|
|
@submit="onSubmit"
|
|
:validation-schema="schema"
|
|
v-slot="{ meta }"
|
|
class="w-full flex-col space-y-3"
|
|
>
|
|
<InputText
|
|
name="api-key"
|
|
type="text"
|
|
:label="t('pages.login-view.main.form.api-key.placeholder')"
|
|
autocomplete="off"
|
|
/>
|
|
<ButtonBase
|
|
class="h-12 w-full"
|
|
mode="primary"
|
|
:icon="IconLogin"
|
|
:disabled="!meta.dirty || !meta.valid"
|
|
>{{ t('pages.login-view.main.form.submit.text') }}</ButtonBase
|
|
>
|
|
</Form>
|
|
</div>
|
|
</div>
|
|
</template>
|