index.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223
  1. "use strict";
  2. var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
  3. if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
  4. if (ar || !(i in from)) {
  5. if (!ar) ar = Array.prototype.slice.call(from, 0, i);
  6. ar[i] = from[i];
  7. }
  8. }
  9. return to.concat(ar || Array.prototype.slice.call(from));
  10. };
  11. Object.defineProperty(exports, "__esModule", { value: true });
  12. var component_1 = require("../common/component");
  13. var FieldName;
  14. (function (FieldName) {
  15. FieldName["TEXT"] = "text";
  16. FieldName["VALUE"] = "value";
  17. FieldName["CHILDREN"] = "children";
  18. })(FieldName || (FieldName = {}));
  19. var defaultFieldNames = {
  20. text: FieldName.TEXT,
  21. value: FieldName.VALUE,
  22. children: FieldName.CHILDREN,
  23. };
  24. (0, component_1.VantComponent)({
  25. props: {
  26. title: String,
  27. value: {
  28. type: String,
  29. },
  30. placeholder: {
  31. type: String,
  32. value: '请选择',
  33. },
  34. activeColor: {
  35. type: String,
  36. value: '#1989fa',
  37. },
  38. options: {
  39. type: Array,
  40. value: [],
  41. },
  42. swipeable: {
  43. type: Boolean,
  44. value: false,
  45. },
  46. closeable: {
  47. type: Boolean,
  48. value: true,
  49. },
  50. showHeader: {
  51. type: Boolean,
  52. value: true,
  53. },
  54. closeIcon: {
  55. type: String,
  56. value: 'cross',
  57. },
  58. fieldNames: {
  59. type: Object,
  60. value: defaultFieldNames,
  61. observer: 'updateFieldNames',
  62. },
  63. useTitleSlot: Boolean,
  64. },
  65. data: {
  66. tabs: [],
  67. activeTab: 0,
  68. textKey: FieldName.TEXT,
  69. valueKey: FieldName.VALUE,
  70. childrenKey: FieldName.CHILDREN,
  71. innerValue: '',
  72. },
  73. watch: {
  74. options: function () {
  75. this.updateTabs();
  76. },
  77. value: function (newVal) {
  78. this.updateValue(newVal);
  79. },
  80. },
  81. created: function () {
  82. this.updateTabs();
  83. },
  84. methods: {
  85. updateValue: function (val) {
  86. var _this = this;
  87. if (val !== undefined) {
  88. var values = this.data.tabs.map(function (tab) { return tab.selected && tab.selected[_this.data.valueKey]; });
  89. if (values.indexOf(val) > -1) {
  90. return;
  91. }
  92. }
  93. this.innerValue = val;
  94. this.updateTabs();
  95. },
  96. updateFieldNames: function () {
  97. var _a = this.data.fieldNames || defaultFieldNames, _b = _a.text, text = _b === void 0 ? 'text' : _b, _c = _a.value, value = _c === void 0 ? 'value' : _c, _d = _a.children, children = _d === void 0 ? 'children' : _d;
  98. this.setData({
  99. textKey: text,
  100. valueKey: value,
  101. childrenKey: children,
  102. });
  103. },
  104. getSelectedOptionsByValue: function (options, value) {
  105. for (var i = 0; i < options.length; i++) {
  106. var option = options[i];
  107. if (option[this.data.valueKey] === value) {
  108. return [option];
  109. }
  110. if (option[this.data.childrenKey]) {
  111. var selectedOptions = this.getSelectedOptionsByValue(option[this.data.childrenKey], value);
  112. if (selectedOptions) {
  113. return __spreadArray([option], selectedOptions, true);
  114. }
  115. }
  116. }
  117. },
  118. updateTabs: function () {
  119. var _this = this;
  120. var options = this.data.options;
  121. var innerValue = this.innerValue;
  122. if (!options.length) {
  123. return;
  124. }
  125. if (innerValue !== undefined) {
  126. var selectedOptions = this.getSelectedOptionsByValue(options, innerValue);
  127. if (selectedOptions) {
  128. var optionsCursor_1 = options;
  129. var tabs_1 = selectedOptions.map(function (option) {
  130. var tab = {
  131. options: optionsCursor_1,
  132. selected: option,
  133. };
  134. var next = optionsCursor_1.find(function (item) { return item[_this.data.valueKey] === option[_this.data.valueKey]; });
  135. if (next) {
  136. optionsCursor_1 = next[_this.data.childrenKey];
  137. }
  138. return tab;
  139. });
  140. if (optionsCursor_1) {
  141. tabs_1.push({
  142. options: optionsCursor_1,
  143. selected: null,
  144. });
  145. }
  146. this.setData({
  147. tabs: tabs_1,
  148. });
  149. wx.nextTick(function () {
  150. _this.setData({
  151. activeTab: tabs_1.length - 1,
  152. });
  153. });
  154. return;
  155. }
  156. }
  157. this.setData({
  158. tabs: [
  159. {
  160. options: options,
  161. selected: null,
  162. },
  163. ],
  164. });
  165. },
  166. onClose: function () {
  167. this.$emit('close');
  168. },
  169. onClickTab: function (e) {
  170. var _a = e.detail, tabIndex = _a.index, title = _a.title;
  171. this.$emit('click-tab', { title: title, tabIndex: tabIndex });
  172. this.setData({
  173. activeTab: tabIndex,
  174. });
  175. },
  176. // 选中
  177. onSelect: function (e) {
  178. var _this = this;
  179. var _a = e.currentTarget.dataset, option = _a.option, tabIndex = _a.tabIndex;
  180. if (option && option.disabled) {
  181. return;
  182. }
  183. var _b = this.data, valueKey = _b.valueKey, childrenKey = _b.childrenKey;
  184. var tabs = this.data.tabs;
  185. tabs[tabIndex].selected = option;
  186. if (tabs.length > tabIndex + 1) {
  187. tabs = tabs.slice(0, tabIndex + 1);
  188. }
  189. if (option[childrenKey]) {
  190. var nextTab = {
  191. options: option[childrenKey],
  192. selected: null,
  193. };
  194. if (tabs[tabIndex + 1]) {
  195. tabs[tabIndex + 1] = nextTab;
  196. }
  197. else {
  198. tabs.push(nextTab);
  199. }
  200. wx.nextTick(function () {
  201. _this.setData({
  202. activeTab: tabIndex + 1,
  203. });
  204. });
  205. }
  206. this.setData({
  207. tabs: tabs,
  208. });
  209. var selectedOptions = tabs.map(function (tab) { return tab.selected; }).filter(Boolean);
  210. var value = option[valueKey];
  211. var params = {
  212. value: value,
  213. tabIndex: tabIndex,
  214. selectedOptions: selectedOptions,
  215. };
  216. this.innerValue = value;
  217. this.$emit('change', params);
  218. if (!option[childrenKey]) {
  219. this.$emit('finish', params);
  220. }
  221. },
  222. },
  223. });