taro-react-uilib 1.4.19-3 → 1.4.19-4

package/dist/styles/components/countdown.scss

@@ -0,0 +1,22 @@
+@import "../../styles/themes/variable.scss";
+
+#{$xh-prefix}-countdown {
+  display: flex;
+  align-items: center;
+  &-time{
+    min-width: 32px;
+    height: 32px;
+    line-height: 32px;
+    background: var(--color-primary-secondary);
+    border-radius: 6px;
+    color: var(--color-primary-reverse);
+    font-size: 24px;
+    text-align: center;
+  }
+  &-dot{
+    color: var(--color-primary-secondary);
+    padding: 3px;
+    font-weight: 500;
+    font-size: 18px;
+  }
+}

package/dist/styles/components/index.scss

@@ -11,6 +11,7 @@
 @import './cell.scss';
 @import './checkbox.scss';
 @import './collapse.scss';
+@import './countdown.scss';
 @import './dialog.scss';
 @import './dialogref.scss';
 @import './echarts.scss';

package/lib/components/Countdown/index.js

@@ -0,0 +1,68 @@
+import React, { useState, useEffect, useRef } from "react";
+import { View } from "@tarojs/components";
+import "./index.scss";
+const Countdown = props => {
+    const { expireDate, overTimeCb, customStyle = false, isPause = false, onTimeChange, } = props;
+    const [hour, setHour] = useState("");
+    const [min, setMin] = useState("");
+    const [sec, setSec] = useState("");
+    const [showTime, setShowTime] = useState(false);
+    const timer = useRef(null);
+    let counttime = 0;
+    const countdown = () => {
+        let h;
+        let m;
+        let s;
+        const endTime = new Date(expireDate).getTime();
+        let nowTime = Date.now();
+        const distance = endTime - nowTime;
+        /** 剩余时间 */
+        onTimeChange && onTimeChange(distance);
+        counttime = Math.floor(distance / 1000);
+        /** 截止时间过期，不展示倒计时 */
+        if (counttime <= 0) {
+            setShowTime(false);
+            clearInterval(timer.current);
+            overTimeCb === null || overTimeCb === void 0 ? void 0 : overTimeCb();
+            return;
+        }
+        setShowTime(true);
+        // 秒
+        s = counttime % 60;
+        s = s < 10 ? "0" + s : s;
+        setSec(s);
+        // 分
+        m = Math.floor((counttime / 60) % 60);
+        m = m < 10 ? "0" + m : m;
+        setMin(m);
+        // 小时
+        h = Math.floor(counttime / 60 / 60);
+        h = h < 10 ? "0" + h : h;
+        setHour(h);
+    };
+    useEffect(() => {
+        // 调用setInterval()方法：间隔指定的毫秒数不停地执行
+        if (expireDate) {
+            clearInterval(timer.current);
+            if (!isPause) {
+                timer.current = setInterval(() => {
+                    countdown();
+                }, 1000);
+            }
+        }
+    }, [expireDate, isPause]);
+    return (React.createElement(React.Fragment, null, showTime &&
+        (customStyle ? (React.createElement(React.Fragment, null,
+            hour,
+            ":",
+            min,
+            ":",
+            sec)) : (React.createElement(View, { className: "xh-countdown" },
+            React.createElement(View, { className: "xh-countdown-time" }, hour),
+            React.createElement(View, { className: "xh-countdown-dot" }, ":"),
+            React.createElement(View, { className: "xh-countdown-time" }, min),
+            React.createElement(View, { className: "xh-countdown-dot" }, ":"),
+            React.createElement(View, { className: "xh-countdown-time" }, sec))))));
+};
+export default Countdown;
+//# sourceMappingURL=index.js.map

package/lib/components/Countdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Countdown/index.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "taro-react-uilib",
-  "version": "1.4.19-3",
+  "version": "1.4.19-4",
   "description": "基于taro的跨端组件库",
   "templateInfo": {
     "name": "default",

package/types/components/Countdown/index.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import "./index.scss";
+export declare type CountdownProps = {
+    expireDate: string | number;
+    overTimeCb?: () => void;
+    customStyle?: boolean;
+    isPause?: boolean;
+    onTimeChange?: (distance: number) => void;
+};
+declare const Countdown: React.FC<CountdownProps>;
+export default Countdown;