index.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. var component_1 = require("../common/component");
  4. var utils_1 = require("../common/utils");
  5. var DEFAULT_DURATION = 200;
  6. component_1.VantComponent({
  7. classes: ['active-class'],
  8. props: {
  9. valueKey: String,
  10. className: String,
  11. itemHeight: Number,
  12. visibleItemCount: Number,
  13. initialOptions: {
  14. type: Array,
  15. value: []
  16. },
  17. defaultIndex: {
  18. type: Number,
  19. value: 0,
  20. observer: function (value) {
  21. this.setIndex(value);
  22. }
  23. }
  24. },
  25. data: {
  26. startY: 0,
  27. offset: 0,
  28. duration: 0,
  29. startOffset: 0,
  30. options: [],
  31. currentIndex: 0
  32. },
  33. created: function () {
  34. var _this = this;
  35. var _a = this.data, defaultIndex = _a.defaultIndex, initialOptions = _a.initialOptions;
  36. this.set({
  37. currentIndex: defaultIndex,
  38. options: initialOptions
  39. }).then(function () {
  40. _this.setIndex(defaultIndex);
  41. });
  42. },
  43. methods: {
  44. getCount: function () {
  45. return this.data.options.length;
  46. },
  47. onTouchStart: function (event) {
  48. this.setData({
  49. startY: event.touches[0].clientY,
  50. startOffset: this.data.offset,
  51. duration: 0
  52. });
  53. },
  54. onTouchMove: function (event) {
  55. var data = this.data;
  56. var deltaY = event.touches[0].clientY - data.startY;
  57. this.setData({
  58. offset: utils_1.range(data.startOffset + deltaY, -(this.getCount() * data.itemHeight), data.itemHeight)
  59. });
  60. },
  61. onTouchEnd: function () {
  62. var data = this.data;
  63. if (data.offset !== data.startOffset) {
  64. this.setData({ duration: DEFAULT_DURATION });
  65. var index = utils_1.range(Math.round(-data.offset / data.itemHeight), 0, this.getCount() - 1);
  66. this.setIndex(index, true);
  67. }
  68. },
  69. onClickItem: function (event) {
  70. var index = event.currentTarget.dataset.index;
  71. this.setIndex(index, true);
  72. },
  73. adjustIndex: function (index) {
  74. var data = this.data;
  75. var count = this.getCount();
  76. index = utils_1.range(index, 0, count);
  77. for (var i = index; i < count; i++) {
  78. if (!this.isDisabled(data.options[i]))
  79. return i;
  80. }
  81. for (var i = index - 1; i >= 0; i--) {
  82. if (!this.isDisabled(data.options[i]))
  83. return i;
  84. }
  85. },
  86. isDisabled: function (option) {
  87. return utils_1.isObj(option) && option.disabled;
  88. },
  89. getOptionText: function (option) {
  90. var data = this.data;
  91. return utils_1.isObj(option) && data.valueKey in option
  92. ? option[data.valueKey]
  93. : option;
  94. },
  95. setIndex: function (index, userAction) {
  96. var _this = this;
  97. var data = this.data;
  98. index = this.adjustIndex(index) || 0;
  99. var offset = -index * data.itemHeight;
  100. if (index !== data.currentIndex) {
  101. return this.set({ offset: offset, currentIndex: index }).then(function () {
  102. userAction && _this.$emit('change', index);
  103. });
  104. }
  105. return this.set({ offset: offset });
  106. },
  107. setValue: function (value) {
  108. var options = this.data.options;
  109. for (var i = 0; i < options.length; i++) {
  110. if (this.getOptionText(options[i]) === value) {
  111. return this.setIndex(i);
  112. }
  113. }
  114. return Promise.resolve();
  115. },
  116. getValue: function () {
  117. var data = this.data;
  118. return data.options[data.currentIndex];
  119. }
  120. }
  121. });