index.js 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. "use strict";
  2. var _component = require("../common/component");
  3. var _utils = require("../common/utils");
  4. var LONG_PRESS_START_TIME = 600;
  5. var LONG_PRESS_INTERVAL = 200; // add num and avoid float number
  6. function add(num1, num2) {
  7. var cardinal = Math.pow(10, 10);
  8. return Math.round((num1 + num2) * cardinal) / cardinal;
  9. }
  10. function equal(value1, value2) {
  11. return String(value1) === String(value2);
  12. }
  13. (0, _component.VantComponent)({
  14. field: true,
  15. classes: ["input-class", "plus-class", "minus-class"],
  16. props: {
  17. value: {
  18. type: null,
  19. observer: function observer(value) {
  20. if (!equal(value, this.data.currentValue)) {
  21. this.setData({
  22. currentValue: this.format(value)
  23. });
  24. }
  25. }
  26. },
  27. integer: {
  28. type: Boolean,
  29. observer: "check"
  30. },
  31. disabled: Boolean,
  32. inputWidth: null,
  33. buttonSize: null,
  34. asyncChange: Boolean,
  35. disableInput: Boolean,
  36. decimalLength: {
  37. type: Number,
  38. value: null,
  39. observer: "check"
  40. },
  41. min: {
  42. type: null,
  43. value: 1,
  44. observer: "check"
  45. },
  46. max: {
  47. type: null,
  48. value: Number.MAX_SAFE_INTEGER,
  49. observer: "check"
  50. },
  51. step: {
  52. type: null,
  53. value: 1
  54. },
  55. showPlus: {
  56. type: Boolean,
  57. value: true
  58. },
  59. showMinus: {
  60. type: Boolean,
  61. value: true
  62. },
  63. disablePlus: Boolean,
  64. disableMinus: Boolean,
  65. longPress: {
  66. type: Boolean,
  67. value: true
  68. }
  69. },
  70. data: {
  71. currentValue: ""
  72. },
  73. created: function created() {
  74. this.setData({
  75. currentValue: this.format(this.data.value)
  76. });
  77. },
  78. methods: {
  79. check: function check() {
  80. var val = this.format(this.data.currentValue);
  81. if (!equal(val, this.data.currentValue)) {
  82. this.setData({
  83. currentValue: val
  84. });
  85. }
  86. },
  87. isDisabled: function isDisabled(type) {
  88. if (type === "plus") {
  89. return this.data.disabled || this.data.disablePlus || this.data.currentValue >= this.data.max;
  90. }
  91. return this.data.disabled || this.data.disableMinus || this.data.currentValue <= this.data.min;
  92. },
  93. onFocus: function onFocus(event) {
  94. this.$emit("focus", event.detail);
  95. },
  96. onBlur: function onBlur(event) {
  97. var value = this.format(event.detail.value);
  98. this.emitChange(value);
  99. this.$emit("blur", Object.assign(Object.assign({}, event.detail), {
  100. value: value
  101. }));
  102. },
  103. // filter illegal characters
  104. filter: function filter(value) {
  105. value = String(value).replace(/[^0-9.-]/g, "");
  106. if (this.data.integer && value.indexOf(".") !== -1) {
  107. value = value.split(".")[0];
  108. }
  109. return value;
  110. },
  111. // limit value range
  112. format: function format(value) {
  113. value = this.filter(value); // format range
  114. value = value === "" ? 0 : +value;
  115. value = Math.max(Math.min(this.data.max, value), this.data.min); // format decimal
  116. if ((0, _utils.isDef)(this.data.decimalLength)) {
  117. value = value.toFixed(this.data.decimalLength);
  118. }
  119. return value;
  120. },
  121. onInput: function onInput(event) {
  122. var _ref = event.detail || {},
  123. _ref$value = _ref.value,
  124. value = _ref$value === void 0 ? "" : _ref$value; // allow input to be empty
  125. if (value === "") {
  126. return;
  127. }
  128. var formatted = this.filter(value); // limit max decimal length
  129. if ((0, _utils.isDef)(this.data.decimalLength) && formatted.indexOf(".") !== -1) {
  130. var pair = formatted.split(".");
  131. formatted = "".concat(pair[0], ".").concat(pair[1].slice(0, this.data.decimalLength));
  132. }
  133. this.emitChange(formatted);
  134. },
  135. emitChange: function emitChange(value) {
  136. if (!this.data.asyncChange) {
  137. this.setData({
  138. currentValue: value
  139. });
  140. }
  141. this.$emit("change", value);
  142. },
  143. onChange: function onChange() {
  144. var type = this.type;
  145. if (this.isDisabled(type)) {
  146. this.$emit("overlimit", type);
  147. return;
  148. }
  149. var diff = type === "minus" ? -this.data.step : +this.data.step;
  150. var value = this.format(add(+this.data.currentValue, diff));
  151. this.emitChange(value);
  152. this.$emit(type);
  153. },
  154. longPressStep: function longPressStep() {
  155. var _this = this;
  156. this.longPressTimer = setTimeout(function () {
  157. _this.onChange();
  158. _this.longPressStep();
  159. }, LONG_PRESS_INTERVAL);
  160. },
  161. onTap: function onTap(event) {
  162. var type = event.currentTarget.dataset.type;
  163. this.type = type;
  164. this.onChange();
  165. },
  166. onTouchStart: function onTouchStart(event) {
  167. var _this2 = this;
  168. if (!this.data.longPress) {
  169. return;
  170. }
  171. clearTimeout(this.longPressTimer);
  172. var type = event.currentTarget.dataset.type;
  173. this.type = type;
  174. this.isLongPress = false;
  175. this.longPressTimer = setTimeout(function () {
  176. _this2.isLongPress = true;
  177. _this2.onChange();
  178. _this2.longPressStep();
  179. }, LONG_PRESS_START_TIME);
  180. },
  181. onTouchEnd: function onTouchEnd() {
  182. if (!this.data.longPress) {
  183. return;
  184. }
  185. clearTimeout(this.longPressTimer);
  186. }
  187. }
  188. });