RollingText.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. var __create = Object.create;
  2. var __defProp = Object.defineProperty;
  3. var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
  4. var __getOwnPropNames = Object.getOwnPropertyNames;
  5. var __getProtoOf = Object.getPrototypeOf;
  6. var __hasOwnProp = Object.prototype.hasOwnProperty;
  7. var __export = (target, all) => {
  8. for (var name2 in all)
  9. __defProp(target, name2, { get: all[name2], enumerable: true });
  10. };
  11. var __copyProps = (to, from, except, desc) => {
  12. if (from && typeof from === "object" || typeof from === "function") {
  13. for (let key of __getOwnPropNames(from))
  14. if (!__hasOwnProp.call(to, key) && key !== except)
  15. __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  16. }
  17. return to;
  18. };
  19. var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  20. // If the importer is in node compatibility mode or this is not an ESM
  21. // file that has been converted to a CommonJS file using a Babel-
  22. // compatible transform (i.e. "__esModule" has not been set), then set
  23. // "default" to the CommonJS "module.exports" for node compatibility.
  24. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  25. mod
  26. ));
  27. var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  28. var stdin_exports = {};
  29. __export(stdin_exports, {
  30. default: () => stdin_default,
  31. rollingTextProps: () => rollingTextProps
  32. });
  33. module.exports = __toCommonJS(stdin_exports);
  34. var import_vue = require("vue");
  35. var import_use = require("@vant/use");
  36. var import_utils = require("../utils");
  37. var import_use_expose = require("../composables/use-expose");
  38. var import_RollingTextItem = __toESM(require("./RollingTextItem"));
  39. const [name, bem] = (0, import_utils.createNamespace)("rolling-text");
  40. const rollingTextProps = {
  41. startNum: (0, import_utils.makeNumberProp)(0),
  42. targetNum: Number,
  43. textList: (0, import_utils.makeArrayProp)(),
  44. duration: (0, import_utils.makeNumberProp)(2),
  45. autoStart: import_utils.truthProp,
  46. direction: (0, import_utils.makeStringProp)("down"),
  47. stopOrder: (0, import_utils.makeStringProp)("ltr"),
  48. height: (0, import_utils.makeNumberProp)(40)
  49. };
  50. const CIRCLE_NUM = 2;
  51. var stdin_default = (0, import_vue.defineComponent)({
  52. name,
  53. props: rollingTextProps,
  54. setup(props) {
  55. const isCustomType = (0, import_vue.computed)(() => Array.isArray(props.textList) && props.textList.length);
  56. const itemLength = (0, import_vue.computed)(() => {
  57. if (isCustomType.value) return props.textList[0].length;
  58. return `${Math.max(props.startNum, props.targetNum)}`.length;
  59. });
  60. const getTextArrByIdx = (idx) => {
  61. const result = [];
  62. for (let i = 0; i < props.textList.length; i++) {
  63. result.push(props.textList[i][idx]);
  64. }
  65. return result;
  66. };
  67. const targetNumArr = (0, import_vue.computed)(() => {
  68. if (isCustomType.value) return new Array(itemLength.value).fill("");
  69. return (0, import_utils.padZero)(props.targetNum, itemLength.value).split("");
  70. });
  71. const startNumArr = (0, import_vue.computed)(() => (0, import_utils.padZero)(props.startNum, itemLength.value).split(""));
  72. const getFigureArr = (i) => {
  73. const start2 = +startNumArr.value[i];
  74. const target = +targetNumArr.value[i];
  75. const result = [];
  76. for (let i2 = start2; i2 <= 9; i2++) {
  77. result.push(i2);
  78. }
  79. for (let i2 = 0; i2 <= CIRCLE_NUM; i2++) {
  80. for (let j = 0; j <= 9; j++) {
  81. result.push(j);
  82. }
  83. }
  84. for (let i2 = 0; i2 <= target; i2++) {
  85. result.push(i2);
  86. }
  87. return result;
  88. };
  89. const getDelay = (i, len) => {
  90. if (props.stopOrder === "ltr") return 0.2 * i;
  91. return 0.2 * (len - 1 - i);
  92. };
  93. const rolling = (0, import_vue.ref)(props.autoStart);
  94. const start = () => {
  95. rolling.value = true;
  96. };
  97. const reset = () => {
  98. rolling.value = false;
  99. if (props.autoStart) {
  100. (0, import_use.raf)(() => start());
  101. }
  102. };
  103. (0, import_vue.watch)(() => props.autoStart, (value) => {
  104. if (value) {
  105. start();
  106. }
  107. });
  108. (0, import_use_expose.useExpose)({
  109. start,
  110. reset
  111. });
  112. return () => (0, import_vue.createVNode)("div", {
  113. "class": bem()
  114. }, [targetNumArr.value.map((_, i) => (0, import_vue.createVNode)(import_RollingTextItem.default, {
  115. "figureArr": isCustomType.value ? getTextArrByIdx(i) : getFigureArr(i),
  116. "duration": props.duration,
  117. "direction": props.direction,
  118. "isStart": rolling.value,
  119. "height": props.height,
  120. "delay": getDelay(i, itemLength.value)
  121. }, null))]);
  122. }
  123. });