Countdown.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. var _typeof = require("@babel/runtime/helpers/typeof");
  4. Object.defineProperty(exports, "__esModule", {
  5. value: true
  6. });
  7. exports.default = exports.countdownProps = void 0;
  8. var _vue = require("vue");
  9. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  10. var _omit = _interopRequireDefault(require("../_util/omit"));
  11. var _initDefaultProps = _interopRequireDefault(require("../_util/props-util/initDefaultProps"));
  12. var _Statistic = _interopRequireWildcard(require("./Statistic"));
  13. var _utils = require("./utils");
  14. 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); }
  15. 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; }
  16. var REFRESH_INTERVAL = 1000 / 30;
  17. function getTime(value) {
  18. return new Date(value).getTime();
  19. }
  20. var countdownProps = function countdownProps() {
  21. return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _Statistic.statisticProps)()), {}, {
  22. value: [Number, String, Object],
  23. format: String,
  24. onFinish: Function,
  25. onChange: Function
  26. });
  27. };
  28. exports.countdownProps = countdownProps;
  29. var _default = (0, _vue.defineComponent)({
  30. compatConfig: {
  31. MODE: 3
  32. },
  33. name: 'AStatisticCountdown',
  34. props: (0, _initDefaultProps.default)(countdownProps(), {
  35. format: 'HH:mm:ss'
  36. }),
  37. // emits: ['finish', 'change'],
  38. setup: function setup(props, _ref) {
  39. var emit = _ref.emit,
  40. slots = _ref.slots;
  41. var countdownId = (0, _vue.ref)();
  42. var statistic = (0, _vue.ref)();
  43. var syncTimer = function syncTimer() {
  44. var value = props.value;
  45. var timestamp = getTime(value);
  46. if (timestamp >= Date.now()) {
  47. startTimer();
  48. } else {
  49. stopTimer();
  50. }
  51. };
  52. var startTimer = function startTimer() {
  53. if (countdownId.value) return;
  54. var timestamp = getTime(props.value);
  55. countdownId.value = setInterval(function () {
  56. statistic.value.$forceUpdate();
  57. if (timestamp > Date.now()) {
  58. emit('change', timestamp - Date.now());
  59. }
  60. syncTimer();
  61. }, REFRESH_INTERVAL);
  62. };
  63. var stopTimer = function stopTimer() {
  64. var value = props.value;
  65. if (countdownId.value) {
  66. clearInterval(countdownId.value);
  67. countdownId.value = undefined;
  68. var timestamp = getTime(value);
  69. if (timestamp < Date.now()) {
  70. emit('finish');
  71. }
  72. }
  73. };
  74. var formatCountdown = function formatCountdown(_ref2) {
  75. var value = _ref2.value,
  76. config = _ref2.config;
  77. var format = props.format;
  78. return (0, _utils.formatCountdown)(value, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, config), {}, {
  79. format: format
  80. }));
  81. };
  82. var valueRenderHtml = function valueRenderHtml(node) {
  83. return node;
  84. };
  85. (0, _vue.onMounted)(function () {
  86. syncTimer();
  87. });
  88. (0, _vue.onUpdated)(function () {
  89. syncTimer();
  90. });
  91. (0, _vue.onBeforeUnmount)(function () {
  92. stopTimer();
  93. });
  94. return function () {
  95. var value = props.value;
  96. return (0, _vue.createVNode)(_Statistic.default, (0, _objectSpread2.default)({
  97. "ref": statistic
  98. }, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _omit.default)(props, ['onFinish', 'onChange'])), {}, {
  99. value: value,
  100. valueRender: valueRenderHtml,
  101. formatter: formatCountdown
  102. })), slots);
  103. };
  104. }
  105. });
  106. exports.default = _default;