knk
Version:
react components based on react
92 lines (91 loc) • 4.75 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _ahooks = require("ahooks");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var CountDown = function CountDown(props) {
var endTime = props.endTime,
endText = props.endText,
prefixText = props.prefixText,
suffixText = props.suffixText;
var _useSetState = (0, _ahooks.useSetState)({
time: 0,
day: 0,
hour: 0,
min: 0,
sec: 0
}),
_useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
state = _useSetState2[0],
setState = _useSetState2[1];
(0, _react.useEffect)(function () {
countdowm(endTime);
}, []);
var countdowm = function countdowm(timestamp) {
var timer = setInterval(function () {
var nowTime = new Date();
var endTime = new Date(timestamp * 1000);
var time = endTime.getTime() - nowTime.getTime();
if (time > 0) {
var _day = Math.floor(time / 86400000);
var _hour = Math.floor(time / 3600000 % 24);
var _min = Math.floor(time / 60000 % 60);
var _sec = Math.floor(time / 1000 % 60);
_day = _day < 10 ? '0' + _day : _day;
_hour = _hour < 10 ? '0' + _hour : _hour;
_min = _min < 10 ? '0' + _min : _min;
_sec = _sec < 10 ? '0' + _sec : _sec;
setState({
time: time,
day: _day,
hour: _hour,
min: _min,
sec: _sec
});
} else {
setState({
time: time
});
clearInterval(timer);
}
}, 1000);
};
var time = state.time,
day = state.day,
hour = state.hour,
min = state.min,
sec = state.sec;
return /*#__PURE__*/_react.default.createElement("span", null, endText && time < 0 ? /*#__PURE__*/_react.default.createElement("span", null, endText) : /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("span", null, prefixText), /*#__PURE__*/_react.default.createElement("span", {
className: "count-item"
}, day), /*#__PURE__*/_react.default.createElement("span", null, "\u5929"), /*#__PURE__*/_react.default.createElement("span", {
className: "count-item"
}, hour), /*#__PURE__*/_react.default.createElement("span", null, "\u65F6"), /*#__PURE__*/_react.default.createElement("span", {
className: "count-item"
}, min), /*#__PURE__*/_react.default.createElement("span", null, "\u5206"), /*#__PURE__*/_react.default.createElement("span", {
className: "count-item"
}, sec), /*#__PURE__*/_react.default.createElement("span", null, "\u79D2"), /*#__PURE__*/_react.default.createElement("span", null, suffixText)));
};
CountDown.defaultProps = {
endTime: new Date('2023-05-10 15:52:59').getTime() / 1000,
endText: '',
prefixText: '',
suffixText: ''
};
CountDown.propTypes = {
endTime: _propTypes.default.number,
// 10位时间戳
endText: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
// 结束文案
prefixText: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
// 前置文案
suffixText: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]) // 后置文案
};
var _default = exports.default = CountDown;