dev

2022-06-28 20:36:06 +08:00
parent 860de7361e
commit ddcae32b63
12 changed files with 403 additions and 38 deletions
@@ -1,23 +1,60 @@
-import { useDispatch } from 'react-redux'
-import {SET_COMMON, CLEAR_COMMON} from '@/constants/common'
-import {useSelector} from '@/reducers/hooks'
-/**
- * 这个hook 用来临时存储数据用
- */
-export default () => {
-    const {common: commonData} = useSelector(state => state.commonData)
-    const dispatch = useDispatch()
-    const setCommonData = (val:any) => {
-        dispatch({type:SET_COMMON, data:val})
-    }
+import dayjs from "dayjs"
+import { useEffect, useRef, useState } from "react"

-    const removeCommonData = () => {
-        dispatch({type:CLEAR_COMMON})
+//倒计时hook
+export const useTimeCountDown = () => {
+    const [showTime, setShowTime] = useState({
+        DD: '',
+        HH: '',
+        MM: '',
+        SS: ''
+    })
+    const [timeStatus, setTimeStatus] = useState<0|1|2>(0) //倒计时状体  0:倒计时未开始 1:倒计时中， 2：倒计时已结束
+    const timeObj:any = useRef()
+    const endTime = useRef('')
+    const onStart = (val = '') => {
+        endTime.current = val
+        if(endTime.current) {
+            clearInterval(timeObj.current)
+            timeObj.current = setInterval(() => {
+                count_down()
+            }, 1000)
+        }
+    }
+    useEffect(() => {
+        return () => {
+            clearInterval(timeObj.current)
+        }
+    }, [])
+    const count_down = () => {
+        var startData = dayjs();
+        var endDate = dayjs(endTime.current);
+        setTimeStatus(() => 1)
+        if(startData >= endDate)  {
+            clearInterval(timeObj.current)
+            setShowTime((e) => ({...e, DD:'00', HH:'00', MM:'00', SS:'00'}))
+            setTimeStatus(() => 2)
+            return false
+        }
+        var _dd = endDate.diff(startData,'day');
+        var _hh = endDate.diff(startData,'hour');
+        var _mm = endDate.diff(startData,'minute');
+        var _ss = endDate.diff(startData,'second');
+        // 转换
+        var hh = _hh - (_dd*24);
+        var mm = _mm - (_hh*60);
+        var ss = _ss - (_mm*60);
+        // 格式化
+        var DD =  ('00'+_dd).slice(-2);
+        var HH =  ('00'+hh).slice(-2);
+        var MM =  ('00'+mm).slice(-2);
+        var SS =  ('00'+ss).slice(-2);
+        // console.log('endTime::', `${DD}-${HH}-${MM}-${SS}`)
+        setShowTime((e) => ({...e, DD, HH, MM, SS}))
    }
-
    return {
-        setCommonData,
-        removeCommonData,
-        commonData
+        showTime,
+        onStart,
+        timeStatus
    }
-}
+}