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> | ... | ... |