index.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. import { __awaiter, __generator } from "tslib";
  2. import { Component, getValueFromProps, triggerEvent, triggerEventOnly, triggerEventValues, } from '../../_util/simply';
  3. import { resolveEventValue, resolveEventValues } from '../../_util/platform';
  4. import { CascaderDefaultProps } from './props';
  5. import equal from 'fast-deep-equal';
  6. import mixinValue from '../../mixins/value';
  7. Component(CascaderDefaultProps, {
  8. // visible受控判断
  9. isVisibleControlled: function () {
  10. return 'visible' in getValueFromProps(this);
  11. },
  12. initColumns: function () {
  13. var _a = getValueFromProps(this, [
  14. 'options',
  15. 'visible',
  16. 'defaultVisible',
  17. 'value',
  18. 'defaultValue',
  19. ]), options = _a[0], visible = _a[1], defaultVisible = _a[2], value = _a[3], defaultValue = _a[4];
  20. var realValue = value || defaultValue || [];
  21. var columns = this.getterColumns(realValue, options);
  22. // 首次无需校验value有效性,onOk时会校验
  23. this.setData({
  24. columns: columns,
  25. visible: this.isVisibleControlled() ? visible : defaultVisible,
  26. currentValue: realValue,
  27. formattedValueText: this.onFormat(),
  28. });
  29. },
  30. getterColumns: function (value, options) {
  31. var getColumns = function (options, value, columns) {
  32. var _a;
  33. if (columns === void 0) { columns = []; }
  34. columns.push(options.map(function (v) { return ({ value: v.value, label: v.label }); }));
  35. var currentOption = options.find(function (v) { return v.value === (value === null || value === void 0 ? void 0 : value[columns.length - 1]); }) ||
  36. options[0];
  37. if (((_a = currentOption === null || currentOption === void 0 ? void 0 : currentOption.children) === null || _a === void 0 ? void 0 : _a.length) > 0) {
  38. return getColumns(currentOption.children, value, columns);
  39. }
  40. return columns;
  41. };
  42. return getColumns(options, value);
  43. },
  44. // 获取有效value,若从x项开始在columns里找不到,则从此项开始都选第一条
  45. getValidValue: function (value, columns) {
  46. var result = [];
  47. var _loop_1 = function (i) {
  48. if (!columns[i].some(function (v) { return (v === null || v === void 0 ? void 0 : v.value) === (value === null || value === void 0 ? void 0 : value[i]); })) {
  49. result.push.apply(result, columns.slice(i).map(function (v) { var _a; return (_a = v === null || v === void 0 ? void 0 : v[0]) === null || _a === void 0 ? void 0 : _a.value; }));
  50. return "break";
  51. }
  52. else {
  53. result[i] = value[i];
  54. }
  55. };
  56. for (var i = 0; i < columns.length; i++) {
  57. var state_1 = _loop_1(i);
  58. if (state_1 === "break")
  59. break;
  60. }
  61. return result;
  62. },
  63. getOptionByValue: function (value) {
  64. var _a;
  65. var options = getValueFromProps(this, 'options');
  66. if (!((value === null || value === void 0 ? void 0 : value.length) > 0))
  67. return null;
  68. var result = [];
  69. var item = options.find(function (v) { return v.value === value[0]; });
  70. var _loop_2 = function (i) {
  71. if (!item) {
  72. return { value: null };
  73. }
  74. result.push({
  75. value: item.value,
  76. label: item.label,
  77. });
  78. item = (_a = item.children) === null || _a === void 0 ? void 0 : _a.find(function (v) { return v.value === value[i + 1]; });
  79. };
  80. for (var i = 0; i < value.length; i++) {
  81. var state_2 = _loop_2(i);
  82. if (typeof state_2 === "object")
  83. return state_2.value;
  84. }
  85. return result;
  86. },
  87. onChange: function (selectedVal) {
  88. var selectedValue = resolveEventValues(selectedVal)[0];
  89. var options = getValueFromProps(this, 'options');
  90. var columns = this.data.columns;
  91. var newColumns = this.getterColumns(selectedValue, options);
  92. // columns没变化说明selectedValue在范围内,无需重置
  93. var newData = {};
  94. if (!equal(columns, newColumns)) {
  95. selectedValue = this.getValidValue(selectedValue, newColumns);
  96. newData.columns = newColumns;
  97. }
  98. newData.currentValue = selectedValue;
  99. this.setData(newData);
  100. triggerEventValues(this, 'change', [
  101. selectedValue,
  102. this.getOptionByValue(selectedValue),
  103. ]);
  104. },
  105. onOk: function () {
  106. return __awaiter(this, void 0, void 0, function () {
  107. var currentValue, options, newColumns, validValue;
  108. return __generator(this, function (_a) {
  109. currentValue = this.data.currentValue;
  110. options = getValueFromProps(this, 'options');
  111. newColumns = this.getterColumns(currentValue, options);
  112. validValue = this.getValidValue(currentValue, newColumns);
  113. if (!this.isControlled()) {
  114. this.update(validValue);
  115. }
  116. triggerEventValues(this, 'ok', [
  117. validValue,
  118. this.getOptionByValue(validValue),
  119. ]);
  120. return [2 /*return*/];
  121. });
  122. });
  123. },
  124. onVisibleChange: function (visible) {
  125. var _this = this;
  126. var options = getValueFromProps(this, 'options');
  127. var columns = this.data.columns;
  128. var realValue = this.getValue();
  129. if (!this.isVisibleControlled() && visible) {
  130. var newColumns_1 = this.getterColumns(realValue, options);
  131. if (!equal(columns, newColumns_1)) {
  132. this.setData({ columns: newColumns_1 }, function () {
  133. _this.setData({
  134. currentValue: _this.getValidValue(realValue, newColumns_1),
  135. formattedValueText: _this.onFormat(),
  136. });
  137. });
  138. }
  139. }
  140. triggerEvent(this, 'visibleChange', resolveEventValue(visible));
  141. },
  142. defaultFormat: function (value, options) {
  143. if (options) {
  144. return options.map(function (v) { return v.label; }).join('');
  145. }
  146. return '';
  147. },
  148. onFormat: function () {
  149. var realValue = this.getValue();
  150. var onFormat = getValueFromProps(this, 'onFormat');
  151. var formatValueByProps = onFormat && onFormat(realValue, this.getOptionByValue(realValue));
  152. if (formatValueByProps !== undefined && formatValueByProps !== null) {
  153. return formatValueByProps;
  154. }
  155. return this.defaultFormat(realValue, this.getOptionByValue(realValue));
  156. },
  157. onCancel: function (e) {
  158. triggerEventOnly(this, 'cancel', e);
  159. },
  160. }, {
  161. currentValue: [],
  162. columns: [],
  163. formattedValueText: '',
  164. visible: false,
  165. }, [mixinValue()], {
  166. onInit: function () {
  167. this.initColumns();
  168. },
  169. didUpdate: function (prevProps, prevData) {
  170. var options = getValueFromProps(this, 'options');
  171. if (!equal(options, prevProps.options)) {
  172. var currentValue = this.data.currentValue;
  173. var newColumns = this.getterColumns(currentValue, options);
  174. this.setData({
  175. columns: newColumns,
  176. });
  177. }
  178. if (!this.isEqualValue(prevData)) {
  179. var realValue = this.getValue();
  180. var newColumns = this.getterColumns(realValue, options);
  181. var currentValue = this.getValidValue(realValue, newColumns);
  182. this.setData({ currentValue: currentValue, formattedValueText: this.onFormat() });
  183. }
  184. var visible = getValueFromProps(this, 'visible');
  185. if (this.isVisibleControlled() && !equal(prevProps.visible, visible)) {
  186. this.setData({ visible: visible });
  187. }
  188. },
  189. });