countdown2.js 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var index = require('../../statistic/index.js');
  5. var countdown = require('./countdown.js');
  6. var utils = require('./utils.js');
  7. var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
  8. var raf = require('../../../utils/raf.js');
  9. var event = require('../../../constants/event.js');
  10. const __default__ = vue.defineComponent({
  11. name: "ElCountdown"
  12. });
  13. const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  14. ...__default__,
  15. props: countdown.countdownProps,
  16. emits: countdown.countdownEmits,
  17. setup(__props, { expose, emit }) {
  18. const props = __props;
  19. let timer;
  20. const rawValue = vue.ref(0);
  21. const displayValue = vue.computed(() => utils.formatTime(rawValue.value, props.format));
  22. const formatter = (val) => utils.formatTime(val, props.format);
  23. const stopTimer = () => {
  24. if (timer) {
  25. raf.cAF(timer);
  26. timer = void 0;
  27. }
  28. };
  29. const startTimer = () => {
  30. const timestamp = utils.getTime(props.value);
  31. const frameFunc = () => {
  32. let diff = timestamp - Date.now();
  33. emit(event.CHANGE_EVENT, diff);
  34. if (diff <= 0) {
  35. diff = 0;
  36. stopTimer();
  37. emit("finish");
  38. } else {
  39. timer = raf.rAF(frameFunc);
  40. }
  41. rawValue.value = diff;
  42. };
  43. timer = raf.rAF(frameFunc);
  44. };
  45. vue.onMounted(() => {
  46. rawValue.value = utils.getTime(props.value) - Date.now();
  47. vue.watch(() => [props.value, props.format], () => {
  48. stopTimer();
  49. startTimer();
  50. }, {
  51. immediate: true
  52. });
  53. });
  54. vue.onBeforeUnmount(() => {
  55. stopTimer();
  56. });
  57. expose({
  58. displayValue
  59. });
  60. return (_ctx, _cache) => {
  61. return vue.openBlock(), vue.createBlock(vue.unref(index.ElStatistic), {
  62. value: rawValue.value,
  63. title: _ctx.title,
  64. prefix: _ctx.prefix,
  65. suffix: _ctx.suffix,
  66. "value-style": _ctx.valueStyle,
  67. formatter
  68. }, vue.createSlots({
  69. _: 2
  70. }, [
  71. vue.renderList(_ctx.$slots, (_, name) => {
  72. return {
  73. name,
  74. fn: vue.withCtx(() => [
  75. vue.renderSlot(_ctx.$slots, name)
  76. ])
  77. };
  78. })
  79. ]), 1032, ["value", "title", "prefix", "suffix", "value-style"]);
  80. };
  81. }
  82. });
  83. var Countdown = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "countdown.vue"]]);
  84. exports["default"] = Countdown;
  85. //# sourceMappingURL=countdown2.js.map