picker-item.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  2. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  3. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  4. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  5. return c > 3 && r && Object.defineProperty(target, key, r), r;
  6. };
  7. import { SuperComponent, wxComponent } from '../common/src/index';
  8. import config from '../common/config';
  9. import props from './props';
  10. const { prefix } = config;
  11. const name = `${prefix}-picker-item`;
  12. const itemHeight = 80;
  13. const DefaultDuration = 240;
  14. const { windowWidth } = wx.getSystemInfoSync();
  15. const rpx2px = (rpx) => Math.floor((windowWidth * rpx) / 750);
  16. const range = function (num, min, max) {
  17. return Math.min(Math.max(num, min), max);
  18. };
  19. let PickerItem = class PickerItem extends SuperComponent {
  20. constructor() {
  21. super(...arguments);
  22. this.relations = {
  23. '../picker/picker': {
  24. type: 'parent',
  25. linked(parent) {
  26. if ('keys' in parent.data) {
  27. const { keys } = parent.data;
  28. this.setData({
  29. labelAlias: (keys === null || keys === void 0 ? void 0 : keys.label) || 'label',
  30. valueAlias: (keys === null || keys === void 0 ? void 0 : keys.value) || 'value',
  31. });
  32. }
  33. },
  34. },
  35. };
  36. this.externalClasses = [`${prefix}-class`];
  37. this.properties = props;
  38. this.observers = {
  39. options() {
  40. this.update();
  41. },
  42. };
  43. this.data = {
  44. prefix,
  45. classPrefix: name,
  46. offset: 0,
  47. duration: 0,
  48. value: '',
  49. curIndex: 0,
  50. labelAlias: 'label',
  51. valueAlias: 'value',
  52. };
  53. this.methods = {
  54. onTouchStart(event) {
  55. this.StartY = event.touches[0].clientY;
  56. this.StartOffset = this.data.offset;
  57. this.setData({ duration: 0 });
  58. },
  59. onTouchMove(event) {
  60. const { StartY, StartOffset, itemHeight } = this;
  61. const touchDeltaY = event.touches[0].clientY - StartY;
  62. const deltaY = this.calculateViewDeltaY(touchDeltaY);
  63. this.setData({
  64. offset: range(StartOffset + deltaY, -(this.getCount() * itemHeight), 0),
  65. duration: DefaultDuration,
  66. });
  67. },
  68. onTouchEnd() {
  69. const { offset, labelAlias, valueAlias } = this.data;
  70. const { options } = this.properties;
  71. if (offset === this.StartOffset) {
  72. return;
  73. }
  74. const index = range(Math.round(-offset / this.itemHeight), 0, this.getCount() - 1);
  75. this.setData({
  76. curIndex: index,
  77. offset: -index * this.itemHeight,
  78. });
  79. if (index === this._selectedIndex) {
  80. return;
  81. }
  82. wx.nextTick(() => {
  83. var _a, _b, _c;
  84. this._selectedIndex = index;
  85. this._selectedValue = (_a = options[index]) === null || _a === void 0 ? void 0 : _a[valueAlias];
  86. this._selectedLabel = (_b = options[index]) === null || _b === void 0 ? void 0 : _b[labelAlias];
  87. (_c = this.$parent) === null || _c === void 0 ? void 0 : _c.triggerColumnChange({
  88. index,
  89. column: this.columnIndex || 0,
  90. });
  91. });
  92. },
  93. update() {
  94. var _a, _b;
  95. const { options, value, labelAlias, valueAlias } = this.data;
  96. const index = options.findIndex((item) => item[valueAlias] === value);
  97. const selectedIndex = index > 0 ? index : 0;
  98. this.setData({
  99. offset: -selectedIndex * this.itemHeight,
  100. curIndex: selectedIndex,
  101. });
  102. this._selectedIndex = selectedIndex;
  103. this._selectedValue = (_a = options[selectedIndex]) === null || _a === void 0 ? void 0 : _a[valueAlias];
  104. this._selectedLabel = (_b = options[selectedIndex]) === null || _b === void 0 ? void 0 : _b[labelAlias];
  105. },
  106. resetOrigin() {
  107. this.update();
  108. },
  109. getCount() {
  110. var _a, _b;
  111. return (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.length;
  112. },
  113. };
  114. }
  115. calculateViewDeltaY(touchDeltaY) {
  116. return Math.abs(touchDeltaY) > itemHeight ? 1.2 * touchDeltaY : touchDeltaY;
  117. }
  118. created() {
  119. this.StartY = 0;
  120. this.StartOffset = 0;
  121. this.itemHeight = rpx2px(itemHeight);
  122. }
  123. };
  124. PickerItem = __decorate([
  125. wxComponent()
  126. ], PickerItem);
  127. export default PickerItem;