@nutui/nutui-react-taro 1.2.2-beta.0

package/dist/esm/countdown.taro-cd6a1bd4.js

@@ -0,0 +1,220 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["showPlainText", "showDays", "paused", "startTime", "endTime", "className", "style", "onEnd", "onPaused", "onRestart", "onUpdate", "children"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import React__default, { useState, useRef, useEffect } from 'react';
+import { c as cn } from './bem-893ad28d.js';
+import { u as useConfig } from './configprovider-18657611.js';
+var defaultProps = {
+  showPlainText: false,
+  showDays: false,
+  paused: false,
+  startTime: Date.now(),
+  endTime: Date.now()
+};
+
+var CountDown = function CountDown(props) {
+  var _useConfig = useConfig(),
+      locale = _useConfig.locale;
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      showPlainText = _defaultProps$props.showPlainText,
+      showDays = _defaultProps$props.showDays,
+      paused = _defaultProps$props.paused,
+      startTime = _defaultProps$props.startTime,
+      endTime = _defaultProps$props.endTime,
+      className = _defaultProps$props.className,
+      style = _defaultProps$props.style,
+      onEnd = _defaultProps$props.onEnd,
+      onPaused = _defaultProps$props.onPaused,
+      onRestart = _defaultProps$props.onRestart,
+      onUpdate = _defaultProps$props.onUpdate,
+      children = _defaultProps$props.children,
+      rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  var b = cn('countdown');
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      restTimeStamp = _useState2[0],
+      setRestTime = _useState2[1];
+
+  var stateRef = useRef({
+    pauseTime: 0,
+    curr: 0,
+    timer: 0,
+    isPaused: paused,
+    isIninted: false
+  }); // 补0操作
+
+  var fill2 = function fill2(v) {
+    v += '';
+
+    while (v.length < 2) {
+      v = "0".concat(v);
+    }
+
+    return v;
+  }; // 倒计时数据
+
+
+  var restTime = function restTime(t) {
+    var ts = t;
+    var rest = {
+      d: '-',
+      h: '--',
+      m: '--',
+      s: '--'
+    };
+
+    if (ts === 0) {
+      rest = {
+        d: '0',
+        h: '00',
+        m: '00',
+        s: '00'
+      };
+    }
+
+    if (ts) {
+      var ds = 24 * 60 * 60 * 1000;
+      var hs = 60 * 60 * 1000;
+      var ms = 60 * 1000;
+      var d = ts >= ds ? parseInt(String(ts / ds)) : 0;
+      var h = ts - d * ds >= hs ? parseInt(String((ts - d * ds) / hs)) : 0;
+      var m = ts - d * ds - h * hs >= ms ? parseInt(String((ts - d * ds - h * hs) / ms)) : 0;
+      var s = Math.round((ts - d * ds - h * hs - m * ms) / 1000);
+      if (d >= 0) rest.d = "".concat(d);
+      if (h >= 0) rest.h = fill2(h);
+      if (m >= 0) rest.m = fill2(m);
+      if (s >= 0) rest.s = fill2(s);
+    }
+
+    return rest;
+  }; // 倒计最终时格式数据
+
+
+  var resttime = function () {
+    var rest = restTime(restTimeStamp);
+    var d = rest.d;
+
+    if (!showDays && Number(d) > 0) {
+      rest.h = fill2(Number(rest.h) + Number(d) * 24);
+      rest.d = '0';
+    }
+
+    return rest;
+  }(); // 获取时间戳
+
+
+  var getTimeStamp = function getTimeStamp(timeStr) {
+    if (!timeStr) return Date.now();
+    var t = timeStr;
+    t = t > 0 ? +t : t.toString().replace(/\-/g, '/');
+    return new Date(t).getTime();
+  }; // 展示文案，English todo @hanyuxinting
+
+
+  var plainText = function () {
+    var d = resttime.d,
+        h = resttime.h,
+        m = resttime.m,
+        s = resttime.s;
+    var showDayshours = Number(d) > 0 && showDays ? "".concat(d).concat(locale.countdown.day).concat(h) : h;
+    return "".concat(showDayshours).concat(locale.countdown.hour).concat(m).concat(locale.countdown.minute).concat(s).concat(locale.countdown.second);
+  }(); // 初始化
+
+
+  var initTimer = function initTimer() {
+    if (!stateRef.current.isIninted) {
+      stateRef.current.isIninted = true;
+    }
+
+    var delay = 1000;
+    var curr = Date.now();
+    var start = getTimeStamp(startTime || curr);
+    var end = getTimeStamp(endTime || curr);
+    var diffTime = curr - start;
+    setRestTime(end - (start + diffTime));
+    stateRef.current.timer = setInterval(function () {
+      if (!stateRef.current.isPaused) {
+        var _restTime = end - (Date.now() - stateRef.current.pauseTime + diffTime);
+
+        setRestTime(_restTime);
+
+        if (_restTime < 0) {
+          setRestTime(0);
+          onEnd && onEnd();
+          clearInterval(stateRef.current.timer);
+        }
+      }
+    }, delay);
+  }; // 监听值变更
+
+
+  useEffect(function () {
+    if (onUpdate) {
+      var tranTime = restTime(restTimeStamp);
+      onUpdate(tranTime);
+    }
+  }, [restTimeStamp]); // 监听暂停
+
+  useEffect(function () {
+    if (stateRef.current.isIninted) {
+      stateRef.current.isPaused = paused;
+
+      if (paused) {
+        stateRef.current.curr = getTimeStamp();
+        onPaused && onPaused(restTimeStamp);
+      } else {
+        stateRef.current.pauseTime += getTimeStamp() - stateRef.current.curr;
+        onRestart && onRestart(restTimeStamp);
+      }
+    }
+  }, [paused]); // 监听开始结束时间变更
+
+  useEffect(function () {
+    if (stateRef.current.isIninted) {
+      initTimer();
+    }
+  }, [endTime, startTime]); // 初始化
+
+  useEffect(function () {
+    initTimer();
+    return componentWillUnmount;
+  }, []);
+
+  var componentWillUnmount = function componentWillUnmount() {
+    clearInterval(stateRef.current.timer);
+  };
+
+  return React__default.createElement("div", _objectSpread({
+    className: "".concat(b(), " ").concat(className || ''),
+    style: _objectSpread({}, style)
+  }, rest), children || React__default.createElement(React__default.Fragment, null, showPlainText ? React__default.createElement("div", {
+    className: b('block')
+  }, " ", plainText, " ") : React__default.createElement(React__default.Fragment, null, Number(resttime.d) >= 0 && showDays ? React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+    className: b('block')
+  }, resttime.d), React__default.createElement("div", {
+    className: b('dot')
+  }, locale.countdown.day || ':')) : null, React__default.createElement("div", {
+    className: b('block')
+  }, resttime.h), React__default.createElement("div", {
+    className: b('dot')
+  }, ":"), React__default.createElement("div", {
+    className: b('block')
+  }, resttime.m), React__default.createElement("div", {
+    className: b('dot')
+  }, ":"), React__default.createElement("div", {
+    className: b('block')
+  }, resttime.s))));
+};
+
+CountDown.defaultProps = defaultProps;
+CountDown.displayName = 'NutCountDown';
+export { CountDown as C };