julien/miniminu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add minutes and query params for the home

Browse Source
This commit is contained in:
Julien Calixte
2023-03-14 14:12:23 +01:00
parent 5e0c953b1d
commit 08a9751ed3
2 changed files with 30 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/ResponsiveTimeUntil.vue
View File

@@ -2,13 +2,16 @@
import { onUnmounted, ref } from "vue"
import { timeUntil } from "../services/time-until"
const timeUntilTarget = timeUntil("2024-03-13T09:00:00.000Z")
const props = defineProps<{ project?: string; target?: string }>()
const yearsUntil = ref(timeUntilTarget.years)
const monthsUntil = ref(timeUntilTarget.months)
const daysUntil = ref(timeUntilTarget.days)
const hoursUntil = ref(timeUntilTarget.hours)
const secondsUntil = ref(timeUntilTarget.seconds)
const timeUntilTarget = props.target ? timeUntil(props.target) : null
const yearsUntil = ref(timeUntilTarget?.years ?? 0)
const monthsUntil = ref(timeUntilTarget?.months ?? 0)
const daysUntil = ref(timeUntilTarget?.days ?? 0)
const hoursUntil = ref(timeUntilTarget?.hours ?? 0)
const minutesUntil = ref(timeUntilTarget?.minutes ?? 0)
const secondsUntil = ref(timeUntilTarget?.seconds ?? 0)
const id = setInterval(() => {
const timeUntilTarget = timeUntil("2024-03-13T09:00:00.000Z")
@@ -17,6 +20,7 @@ const id = setInterval(() => {
monthsUntil.value = timeUntilTarget.months
daysUntil.value = timeUntilTarget.days
hoursUntil.value = timeUntilTarget.hours
minutesUntil.value = timeUntilTarget.minutes
secondsUntil.value = timeUntilTarget.seconds
}, 1000)
@@ -24,13 +28,16 @@ onUnmounted(() => clearInterval(id))
</script>
<template>
<section>
<div>{{ yearsUntil }} years</div>
<div>{{ monthsUntil }} months</div>
<div>{{ daysUntil }} days</div>
<div>{{ hoursUntil }} hours</div>
<div>{{ secondsUntil }} seconds</div>
<h1 v-if="props.project">{{ props.project }}</h1>
<section v-if="timeUntilTarget">
<div v-if="yearsUntil > 0" class="count">{{ yearsUntil }} years</div>
<div v-if="monthsUntil > 0" class="count">{{ monthsUntil }} months</div>
<div v-if="daysUntil > 0" class="count">{{ daysUntil }} days</div>
<div v-if="hoursUntil > 0" class="count">{{ hoursUntil }} hours</div>
<div v-if="minutesUntil > 0" class="count">{{ minutesUntil }} minutes</div>
<div v-if="secondsUntil > 0" class="count">{{ secondsUntil }} seconds</div>
</section>
<section v-else>No target</section>
</template>
<style scoped>