calendar
Today button
Today button
Загрузка превью…
src/calendar/c-calendar-12.vue
<script setup lang="ts">
import { ref } from "vue"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { Calendar as CCalendar } from "@/components/ui/calendar"
const today = new Date(2026, 0, 15)
const selectedDay = new Date(2025, 11, 18) // today - 28 days
const month = ref<Date>(selectedDay)
const date = ref<Date | undefined>(selectedDay)
function setToday() {
date.value = today
month.value = today
}
</script>
<template>
<Card class="p-0">
<CardContent class="p-0">
<CCalendar mode="single" v-model="date" :month="month" @update:month="month = $event" />
<Button class="mb-2 ml-4" size="sm" variant="outline" @click="setToday">Current today</Button>
</CardContent>
</Card>
</template>