timetracker update

This commit is contained in:
Daniel Goc
2026-03-11 09:33:36 +01:00
parent bbf8a2c133
commit 9ef4bb219b
121 changed files with 4328 additions and 2231 deletions

View File

@@ -4,10 +4,8 @@ import { useRouter } from 'vue-router'
import { useAuthStore } from '@/stores/auth'
import { useValidation } from '@/composable/useValidation'
import type { FormError } from '@nuxt/ui'
import { useI18n } from 'vue-i18n'
import { i18n } from '@/plugins/i18n'
import { i18n } from '@/plugins/02_i18n'
const { t } = useI18n()
const router = useRouter()
const authStore = useAuthStore()
const validation = useValidation()
@@ -30,20 +28,24 @@ function goToRegister() {
router.push({ name: 'register' })
}
function validate(): FormError[] {
validation.reset()
validation.validateEmail(email, 'email', i18n.t('validate_error.email_required'))
return validation.errors
}
</script>
<template>
<div class="h-[100vh] flex items-center justify-center px-4 sm:px-6 lg:px-8">
<div class="h-[100vh] flex flex-col items-center justify-center px-4 sm:px-6 lg:px-8">
<div class="text-center mb-15">
<div
class="inline-flex items-center justify-center w-16 h-16 rounded-2xl bg-primary-500 text-white mb-4 shadow-lg shadow-primary-500/30">
<UIcon name="i-heroicons-clock" class="w-8 h-8" />
</div>
<h1 class="text-3xl font-bold text-gray-900 dark:text-white">TimeTracker</h1>
</div>
<div class="w-full max-w-md flex flex-col gap-4">
<!-- Success State -->
<template v-if="submitted">
<div class="text-center flex flex-col gap-4">
<UIcon name="i-heroicons-envelope" class="w-12 h-12 mx-auto text-primary-500" />
@@ -51,13 +53,13 @@ function validate(): FormError[] {
<p class="text-sm text-gray-600 dark:text-gray-400">
{{ $t('general.password_reset_link_sent_notice') }}
</p>
<UButton color="neutral" variant="outline" block @click="goToLogin" class="dark:text-white text-black">
<UButton color="neutral" variant="outline" block @click="goToLogin"
class="dark:text-white text-black cursor-pointer">
{{ $t('general.back_to_sign_in') }}
</UButton>
</div>
</template>
<!-- Form State -->
<template v-else>
<div class="text-center">
<p class="text-sm text-gray-600 dark:text-gray-400">
@@ -73,29 +75,31 @@ function validate(): FormError[] {
<UFormField :label="$t('general.email_address')" name="email" required
class="w-full dark:text-white text-black">
<UInput v-model="email" :placeholder="$t('general.enter_your_email')" :disabled="authStore.loading"
class="w-full dark:text-white text-black" />
class="w-full dark:text-white text-black placeholder:text-(--placeholder)" />
</UFormField>
<UButton type="submit" block :loading="authStore.loading"
class="text-white bg-(--color-blue-600) dark:bg-(--color-blue-500)">
class="text-white bg-(--color-blue-600) dark:bg-(--color-blue-500) cursor-pointer">
{{ $t('general.send_password_reset_link') }}
</UButton>
</UForm>
<div class="text-center flex flex-col gap-3 border-t dark:border-(--border-dark) border-(--border-light) pt-4">
<UButton color="neutral" variant="outline" :loading="authStore.loading"
class="w-full flex justify-center dark:text-white text-black" @click="goToLogin">
<button color="neutral" variant="outline" :loading="authStore.loading"
class="w-full flex items-center gap-2 justify-center text-[15px] dark:text-white text-black cursor-pointer"
@click="goToLogin">
<UIcon name="mingcute:arrow-left-line" class="text-(--color-blue-600) dark:text-(--color-blue-500) text-[16px]" />
{{ $t('general.back_to_sign_in') }}
</UButton>
</button>
<p class="text-sm text-gray-600 dark:text-gray-400">
{{ $t('general.dont_have_an_account') }}
<UButton variant="link" size="sm" @click="goToRegister"
class="text-(--color-blue-600) dark:text-(--color-blue-500)">{{ $t('general.create_account_now') }}
</UButton>
<button variant="link" size="sm" @click="goToRegister"
class=" text-[15px] text-(--color-blue-600) dark:text-(--color-blue-500) cursor-pointer">{{
$t('general.create_account_now') }}
</button>
</p>
</div>
</template>
</div>
</div>
</template>