Showing
1 changed file
with
13 additions
and
6 deletions
| 1 | 1 | <script setup lang="ts"> |
| 2 | 2 | import { useIntervalFn } from '@vueuse/core' |
| 3 | 3 | import { ref } from 'vue' |
| 4 | -import { dateUtil, formatToDateTime } from '@/utils/dateUtil' | |
| 4 | +import { dateUtil } from '@/utils/dateUtil' | |
| 5 | 5 | import { DateFormatEnum } from '@/enums/timeEnum' |
| 6 | +import type { CreateComponentType } from '@/core/Library/types' | |
| 6 | 7 | |
| 7 | -const date = ref<string>(formatToDateTime(Date.now())) | |
| 8 | +defineProps<{ | |
| 9 | + config: CreateComponentType | |
| 10 | +}>() | |
| 11 | + | |
| 12 | +const getNowDate = () => `${dateUtil().format('YYYY年MM月DD日')} ${dateUtil().format(DateFormatEnum.HH_MM_SS)}` | |
| 13 | + | |
| 14 | +const date = ref<string>(getNowDate()) | |
| 8 | 15 | |
| 9 | 16 | const week = ['日', '一', '二', '三', '四', '五', '六'] |
| 10 | 17 | |
| 11 | 18 | useIntervalFn(() => { |
| 12 | - date.value = `${dateUtil().format(DateFormatEnum.YYYY_MM_DD)} ${dateUtil().format(DateFormatEnum.HH_MM_SS)}` | |
| 19 | + date.value = getNowDate() | |
| 13 | 20 | }, 1000) |
| 14 | 21 | </script> |
| 15 | 22 | |
| 16 | 23 | <template> |
| 17 | - <main class="w-full h-full flex flex-col justify-center items-center"> | |
| 18 | - <div class="text-[18px]"> | |
| 24 | + <main class="w-full h-full flex flex-col justify-center items-center overflow-hidden"> | |
| 25 | + <div class="text-1em"> | |
| 19 | 26 | {{ date.split(' ')?.[0] }} {{ `星期${week[dateUtil().day()]}` }} |
| 20 | 27 | </div> |
| 21 | - <div class="text-[50px] p-1"> | |
| 28 | + <div class="p-1 text-2em"> | |
| 22 | 29 | {{ date.split(' ')?.[1] }} |
| 23 | 30 | </div> |
| 24 | 31 | </main> | ... | ... |