Added age preview to application view
This commit is contained in:
@@ -109,6 +109,17 @@ watch(() => showCoC.value, async () => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function convertToAge(dob: string) {
|
||||||
|
const [month, day, year] = dob.split('/').map(Number);
|
||||||
|
|
||||||
|
let dobDate = new Date(year, month - 1, day);
|
||||||
|
|
||||||
|
return Math.floor(
|
||||||
|
(Date.now() - dobDate.getTime()) / (1000 * 60 * 60 * 24 * 365.2425)
|
||||||
|
);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -119,7 +130,10 @@ watch(() => showCoC.value, async () => {
|
|||||||
<FormItem>
|
<FormItem>
|
||||||
<FormLabel>What is your date of birth?</FormLabel>
|
<FormLabel>What is your date of birth?</FormLabel>
|
||||||
<FormControl>
|
<FormControl>
|
||||||
|
<template class="flex items-center gap-10">
|
||||||
<DateInput :model-value="(value as string) ?? ''" :disabled="readOnly" @update:model-value="handleChange" />
|
<DateInput :model-value="(value as string) ?? ''" :disabled="readOnly" @update:model-value="handleChange" />
|
||||||
|
<p class="text-muted-foreground">Age: {{ convertToAge(value) }}</p>
|
||||||
|
</template>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
<div class="h-4">
|
<div class="h-4">
|
||||||
<FormMessage class="text-destructive" />
|
<FormMessage class="text-destructive" />
|
||||||
|
|||||||
Reference in New Issue
Block a user