dropdown-item.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  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. import menuProps from '../dropdown-menu/props';
  11. import { getRect } from '../common/utils';
  12. const { prefix } = config;
  13. const name = `${prefix}-dropdown-item`;
  14. let DropdownMenuItem = class DropdownMenuItem extends SuperComponent {
  15. constructor() {
  16. super(...arguments);
  17. this.externalClasses = [
  18. `${prefix}-class`,
  19. `${prefix}-class-content`,
  20. `${prefix}-class-column`,
  21. `${prefix}-class-column-item`,
  22. `${prefix}-class-column-item-label`,
  23. `${prefix}-class-footer`,
  24. ];
  25. this.properties = Object.assign({}, props);
  26. this.data = {
  27. prefix,
  28. classPrefix: name,
  29. show: false,
  30. top: 0,
  31. maskHeight: 0,
  32. initValue: null,
  33. hasChanged: false,
  34. duration: menuProps.duration.value,
  35. zIndex: menuProps.zIndex.value,
  36. overlay: menuProps.showOverlay.value,
  37. labelAlias: 'label',
  38. valueAlias: 'value',
  39. computedLabel: '',
  40. };
  41. this.relations = {
  42. '../dropdown-menu/dropdown-menu': {
  43. type: 'parent',
  44. linked(target) {
  45. const { zIndex, duration, showOverlay } = target.properties;
  46. this.setData({
  47. zIndex,
  48. duration,
  49. showOverlay,
  50. });
  51. },
  52. },
  53. };
  54. this.controlledProps = [
  55. {
  56. key: 'value',
  57. event: 'change',
  58. },
  59. ];
  60. this.observers = {
  61. keys(obj) {
  62. this.setData({
  63. labelAlias: obj.label || 'label',
  64. valueAlias: obj.value || 'value',
  65. });
  66. },
  67. value(v) {
  68. const { options, labelAlias, valueAlias } = this.data;
  69. if (this.data.multiple) {
  70. if (!Array.isArray(v))
  71. throw TypeError('应传入数组类型的 value');
  72. }
  73. const target = options.find((item) => item[valueAlias] === v);
  74. if (target) {
  75. this.setData({
  76. computedLabel: target[labelAlias],
  77. });
  78. }
  79. },
  80. 'label, computedLabel'() {
  81. var _a;
  82. (_a = this.$parent) === null || _a === void 0 ? void 0 : _a.getAllItems();
  83. },
  84. show(visible) {
  85. if (visible) {
  86. this.getParentBottom(() => {
  87. this.setData({ wrapperVisible: true });
  88. });
  89. }
  90. },
  91. };
  92. this.methods = {
  93. closeDropdown() {
  94. var _a;
  95. (_a = this.$parent) === null || _a === void 0 ? void 0 : _a.setData({
  96. activeIdx: -1,
  97. });
  98. this.setData({
  99. show: false,
  100. });
  101. },
  102. getParentBottom(cb) {
  103. getRect(this.$parent, `#${prefix}-bar`).then((rect) => {
  104. this.setData({
  105. top: rect.bottom,
  106. maskHeight: rect.top,
  107. }, cb);
  108. });
  109. },
  110. handleTreeClick(e) {
  111. const { level, value: itemValue } = e.currentTarget.dataset;
  112. const { value } = this.data;
  113. value[level] = itemValue;
  114. this._trigger('change', { value });
  115. },
  116. handleRadioChange(e) {
  117. const { value } = e.detail;
  118. this._trigger('change', { value });
  119. if (!this.data.multiple) {
  120. this.closeDropdown();
  121. }
  122. },
  123. handleMaskClick() {
  124. var _a;
  125. if ((_a = this.$parent) === null || _a === void 0 ? void 0 : _a.properties.closeOnClickOverlay) {
  126. this.closeDropdown();
  127. }
  128. },
  129. handleReset() {
  130. this._trigger('change', { value: [] });
  131. this._trigger('reset');
  132. },
  133. handleConfirm() {
  134. this._trigger('confirm', { value: this.data.value });
  135. this.closeDropdown();
  136. },
  137. onLeaved() {
  138. this.setData({ wrapperVisible: false });
  139. },
  140. };
  141. }
  142. };
  143. DropdownMenuItem = __decorate([
  144. wxComponent()
  145. ], DropdownMenuItem);
  146. export default DropdownMenuItem;