cascader.js 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  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. var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
  8. function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
  9. return new (P || (P = Promise))(function (resolve, reject) {
  10. function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
  11. function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
  12. function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
  13. step((generator = generator.apply(thisArg, _arguments || [])).next());
  14. });
  15. };
  16. import { SuperComponent, wxComponent } from '../common/src/index';
  17. import config from '../common/config';
  18. import props from './props';
  19. import { getRect } from '../common/utils';
  20. const { prefix } = config;
  21. const name = `${prefix}-cascader`;
  22. const defaultOptionLabel = '选择选项';
  23. let Cascader = class Cascader extends SuperComponent {
  24. constructor() {
  25. super(...arguments);
  26. this.externalClasses = [`${prefix}-class`];
  27. this.options = {
  28. multipleSlots: true,
  29. };
  30. this.properties = props;
  31. this.controlledProps = [
  32. {
  33. key: 'value',
  34. event: 'change',
  35. },
  36. ];
  37. this.data = {
  38. prefix,
  39. name,
  40. stepIndex: 0,
  41. selectedIndexes: [],
  42. selectedValue: [],
  43. defaultOptionLabel,
  44. scrollTopList: [],
  45. steps: [defaultOptionLabel],
  46. };
  47. this.observers = {
  48. visible(v) {
  49. if (v) {
  50. const $tabs = this.selectComponent('#tabs');
  51. $tabs === null || $tabs === void 0 ? void 0 : $tabs.setTrack();
  52. this.updateScrollTop();
  53. this.initWithValue();
  54. }
  55. },
  56. 'selectedIndexes, options'() {
  57. var _a, _b, _c, _d;
  58. const { options, selectedIndexes, keys } = this.data;
  59. const selectedValue = [];
  60. const steps = [];
  61. const items = [options];
  62. if (options.length > 0) {
  63. for (let i = 0, size = selectedIndexes.length; i < size; i += 1) {
  64. const index = selectedIndexes[i];
  65. const next = items[i][index];
  66. selectedValue.push(next[(_a = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _a !== void 0 ? _a : 'value']);
  67. steps.push(next[(_b = keys === null || keys === void 0 ? void 0 : keys.label) !== null && _b !== void 0 ? _b : 'label']);
  68. if (next[(_c = keys === null || keys === void 0 ? void 0 : keys.children) !== null && _c !== void 0 ? _c : 'children']) {
  69. items.push(next[(_d = keys === null || keys === void 0 ? void 0 : keys.children) !== null && _d !== void 0 ? _d : 'children']);
  70. }
  71. }
  72. }
  73. if (steps.length < items.length) {
  74. steps.push(defaultOptionLabel);
  75. }
  76. this.setData({
  77. steps,
  78. items,
  79. selectedValue,
  80. stepIndex: items.length - 1,
  81. });
  82. },
  83. stepIndex() {
  84. return __awaiter(this, void 0, void 0, function* () {
  85. const { visible } = this.data;
  86. if (visible) {
  87. this.updateScrollTop();
  88. }
  89. });
  90. },
  91. };
  92. this.methods = {
  93. initWithValue() {
  94. if (this.data.value != null && this.data.value !== '') {
  95. const selectedIndexes = this.getIndexesByValue(this.data.options, this.data.value);
  96. if (selectedIndexes) {
  97. this.setData({ selectedIndexes });
  98. }
  99. }
  100. else {
  101. this.setData({ selectedIndexes: [] });
  102. }
  103. },
  104. getIndexesByValue(options, value) {
  105. var _a, _b, _c;
  106. const { keys } = this.data;
  107. for (let i = 0, size = options.length; i < size; i += 1) {
  108. const opt = options[i];
  109. if (opt[(_a = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _a !== void 0 ? _a : 'value'] === value) {
  110. return [i];
  111. }
  112. if (opt[(_b = keys === null || keys === void 0 ? void 0 : keys.children) !== null && _b !== void 0 ? _b : 'children']) {
  113. const res = this.getIndexesByValue(opt[(_c = keys === null || keys === void 0 ? void 0 : keys.children) !== null && _c !== void 0 ? _c : 'children'], value);
  114. if (res) {
  115. return [i, ...res];
  116. }
  117. }
  118. }
  119. },
  120. updateScrollTop() {
  121. const { visible, items, selectedIndexes, stepIndex } = this.data;
  122. if (visible) {
  123. getRect(this, '.cascader-radio-group-0').then((rect) => {
  124. var _a;
  125. const eachRadioHeight = rect.height / ((_a = items[0]) === null || _a === void 0 ? void 0 : _a.length);
  126. this.setData({
  127. [`scrollTopList[${stepIndex}]`]: eachRadioHeight * selectedIndexes[stepIndex],
  128. });
  129. });
  130. }
  131. },
  132. hide(trigger) {
  133. this.setData({ visible: false });
  134. this.triggerEvent('close', { trigger: trigger });
  135. },
  136. onVisibleChange() {
  137. this.hide('overlay');
  138. },
  139. onClose() {
  140. this.hide('close-btn');
  141. },
  142. onStepClick(e) {
  143. const { index } = e.currentTarget.dataset;
  144. this.setData({ stepIndex: index });
  145. },
  146. onTabChange(e) {
  147. const { value } = e.detail;
  148. this.setData({
  149. stepIndex: value,
  150. });
  151. },
  152. handleSelect(e) {
  153. var _a, _b, _c;
  154. const { level } = e.target.dataset;
  155. const { value } = e.detail;
  156. const { selectedIndexes, items, keys } = this.data;
  157. const index = items[level].findIndex((item) => { var _a; return item[(_a = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _a !== void 0 ? _a : 'value'] === value; });
  158. const item = items[level][index];
  159. if (item.disabled) {
  160. return;
  161. }
  162. selectedIndexes[level] = index;
  163. selectedIndexes.length = level + 1;
  164. this.triggerEvent('pick', { value: item[(_a = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _a !== void 0 ? _a : 'value'], index, level });
  165. if ((_c = item === null || item === void 0 ? void 0 : item[(_b = keys === null || keys === void 0 ? void 0 : keys.children) !== null && _b !== void 0 ? _b : 'children']) === null || _c === void 0 ? void 0 : _c.length) {
  166. this.setData({ selectedIndexes });
  167. }
  168. else {
  169. this.setData({ selectedIndexes }, () => {
  170. var _a;
  171. const { items } = this.data;
  172. this._trigger('change', {
  173. value: item[(_a = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _a !== void 0 ? _a : 'value'],
  174. selectedOptions: items.map((item, index) => item[selectedIndexes[index]]),
  175. });
  176. });
  177. this.hide('finish');
  178. }
  179. },
  180. };
  181. }
  182. };
  183. Cascader = __decorate([
  184. wxComponent()
  185. ], Cascader);
  186. export default Cascader;