Blame view

src/views/sys/lock/useNow.ts 1.12 KB
vben authored
1
import { dateUtil } from '/@/utils/dateUtil';
2
import { reactive, toRefs } from 'vue';
Vben authored
3
import { tryOnMounted, tryOnUnmounted } from '@vueuse/core';
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

export function useNow(immediate = true) {
  let timer: IntervalHandle;

  const state = reactive({
    year: 0,
    month: 0,
    week: '',
    day: 0,
    hour: '',
    minute: '',
    second: 0,
    meridiem: '',
  });

  const update = () => {
vben authored
20
    const now = dateUtil();
21
22
23
24
25
26

    const h = now.format('HH');
    const m = now.format('mm');
    const s = now.get('s');

    state.year = now.get('y');
27
    state.month = now.get('M') + 1;
28
29
    state.week = '星期' + ['日', '一', '二', '三', '四', '五', '六'][now.day()];
    state.day = now.get('date');
30
31
32
33
    state.hour = h;
    state.minute = m;
    state.second = s;
34
    state.meridiem = now.format('A');
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
  };

  function start() {
    update();
    clearInterval(timer);
    timer = setInterval(() => update(), 1000);
  }

  function stop() {
    clearInterval(timer);
  }

  tryOnMounted(() => {
    immediate && start();
  });

  tryOnUnmounted(() => {
    stop();
  });

  return {
    ...toRefs(state),
    start,
    stop,
  };
}