fix: 优化周末倒计时文案
This commit is contained in:
+19
-7
@@ -5,13 +5,14 @@ import { siteConfig } from '~/config/site'
|
|||||||
const now = new Date()
|
const now = new Date()
|
||||||
const today = new Date(now.getFullYear(), now.getMonth(), now.getDate())
|
const today = new Date(now.getFullYear(), now.getMonth(), now.getDate())
|
||||||
|
|
||||||
// 下一个周六或周日
|
|
||||||
const dayOfWeek = today.getDay()
|
const dayOfWeek = today.getDay()
|
||||||
const daysToSat = dayOfWeek === 6 ? 0 : (6 - dayOfWeek + 7) % 7
|
|
||||||
const nextWeekend = new Date(today)
|
|
||||||
nextWeekend.setDate(today.getDate() + daysToSat)
|
|
||||||
|
|
||||||
const weekendDays = daysUntil(nextWeekend)
|
const weekendStatus = getWeekendStatus(dayOfWeek)
|
||||||
|
|
||||||
|
type WeekendStatus = {
|
||||||
|
label: string
|
||||||
|
value: string
|
||||||
|
}
|
||||||
|
|
||||||
// 从 API 获取法定节假日
|
// 从 API 获取法定节假日
|
||||||
const { data: holidaysData } = await useAsyncData('holidays', () =>
|
const { data: holidaysData } = await useAsyncData('holidays', () =>
|
||||||
@@ -38,6 +39,17 @@ function daysUntil(d: Date): number {
|
|||||||
return Math.ceil((d.getTime() - today.getTime()) / 86400000)
|
return Math.ceil((d.getTime() - today.getTime()) / 86400000)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getWeekendStatus(dayOfWeek: number): WeekendStatus {
|
||||||
|
if (dayOfWeek === 5) return { label: '周末', value: '明天就是' }
|
||||||
|
if (dayOfWeek === 6) return { label: '周末', value: '周末愉快' }
|
||||||
|
if (dayOfWeek === 0) return { label: '周末', value: '余额 1 天' }
|
||||||
|
|
||||||
|
return {
|
||||||
|
label: '周末',
|
||||||
|
value: `还有 ${(6 - dayOfWeek + 7) % 7} 天`,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
useHead({
|
useHead({
|
||||||
script: [
|
script: [
|
||||||
{ src: '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js', async: true, defer: true },
|
{ src: '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js', async: true, defer: true },
|
||||||
@@ -122,8 +134,8 @@ onMounted(() => {
|
|||||||
<div class="flex items-center justify-center gap-6 text-sm">
|
<div class="flex items-center justify-center gap-6 text-sm">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<img src="https://api.iconify.design/mdi:calendar-weekend.svg?color=%239ca3af" alt="" class="w-4 h-4" />
|
<img src="https://api.iconify.design/mdi:calendar-weekend.svg?color=%239ca3af" alt="" class="w-4 h-4" />
|
||||||
<span class="text-muted-foreground">周末</span>
|
<span class="text-muted-foreground">{{ weekendStatus.label }}</span>
|
||||||
<span class="font-semibold" style="color: var(--color-primary);">{{ weekendDays }} 天</span>
|
<span class="font-semibold" style="color: var(--color-primary);">{{ weekendStatus.value }}</span>
|
||||||
</div>
|
</div>
|
||||||
<template v-if="nextHoliday">
|
<template v-if="nextHoliday">
|
||||||
<span class="text-muted-foreground/30">|</span>
|
<span class="text-muted-foreground/30">|</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user