index.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222
  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. },
  64. data: {
  65. tabs: [],
  66. activeTab: 0,
  67. textKey: FieldName.TEXT,
  68. valueKey: FieldName.VALUE,
  69. childrenKey: FieldName.CHILDREN,
  70. innerValue: '',
  71. },
  72. watch: {
  73. options: function () {
  74. this.updateTabs();
  75. },
  76. value: function (newVal) {
  77. this.updateValue(newVal);
  78. },
  79. },
  80. created: function () {
  81. this.updateTabs();
  82. },
  83. methods: {
  84. updateValue: function (val) {
  85. var _this = this;
  86. if (val !== undefined) {
  87. var values = this.data.tabs.map(function (tab) { return tab.selected && tab.selected[_this.data.valueKey]; });
  88. if (values.indexOf(val) > -1) {
  89. return;
  90. }
  91. }
  92. this.innerValue = val;
  93. this.updateTabs();
  94. },
  95. updateFieldNames: function () {
  96. 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;
  97. this.setData({
  98. textKey: text,
  99. valueKey: value,
  100. childrenKey: children,
  101. });
  102. },
  103. getSelectedOptionsByValue: function (options, value) {
  104. for (var i = 0; i < options.length; i++) {
  105. var option = options[i];
  106. if (option[this.data.valueKey] === value) {
  107. return [option];
  108. }
  109. if (option[this.data.childrenKey]) {
  110. var selectedOptions = this.getSelectedOptionsByValue(option[this.data.childrenKey], value);
  111. if (selectedOptions) {
  112. return __spreadArray([option], selectedOptions, true);
  113. }
  114. }
  115. }
  116. },
  117. updateTabs: function () {
  118. var _this = this;
  119. var options = this.data.options;
  120. var innerValue = this.innerValue;
  121. if (!options.length) {
  122. return;
  123. }
  124. if (innerValue !== undefined) {
  125. var selectedOptions = this.getSelectedOptionsByValue(options, innerValue);
  126. if (selectedOptions) {
  127. var optionsCursor_1 = options;
  128. var tabs_1 = selectedOptions.map(function (option) {
  129. var tab = {
  130. options: optionsCursor_1,
  131. selected: option,
  132. };
  133. var next = optionsCursor_1.find(function (item) { return item[_this.data.valueKey] === option[_this.data.valueKey]; });
  134. if (next) {
  135. optionsCursor_1 = next[_this.data.childrenKey];
  136. }
  137. return tab;
  138. });
  139. if (optionsCursor_1) {
  140. tabs_1.push({
  141. options: optionsCursor_1,
  142. selected: null,
  143. });
  144. }
  145. this.setData({
  146. tabs: tabs_1,
  147. });
  148. wx.nextTick(function () {
  149. _this.setData({
  150. activeTab: tabs_1.length - 1,
  151. });
  152. });
  153. return;
  154. }
  155. }
  156. this.setData({
  157. tabs: [
  158. {
  159. options: options,
  160. selected: null,
  161. },
  162. ],
  163. });
  164. },
  165. onClose: function () {
  166. this.$emit('close');
  167. },
  168. onClickTab: function (e) {
  169. var _a = e.detail, tabIndex = _a.index, title = _a.title;
  170. this.$emit('click-tab', { title: title, tabIndex: tabIndex });
  171. this.setData({
  172. activeTab: tabIndex,
  173. });
  174. },
  175. // 选中
  176. onSelect: function (e) {
  177. var _this = this;
  178. var _a = e.currentTarget.dataset, option = _a.option, tabIndex = _a.tabIndex;
  179. if (option && option.disabled) {
  180. return;
  181. }
  182. var _b = this.data, valueKey = _b.valueKey, childrenKey = _b.childrenKey;
  183. var tabs = this.data.tabs;
  184. tabs[tabIndex].selected = option;
  185. if (tabs.length > tabIndex + 1) {
  186. tabs = tabs.slice(0, tabIndex + 1);
  187. }
  188. if (option[childrenKey]) {
  189. var nextTab = {
  190. options: option[childrenKey],
  191. selected: null,
  192. };
  193. if (tabs[tabIndex + 1]) {
  194. tabs[tabIndex + 1] = nextTab;
  195. }
  196. else {
  197. tabs.push(nextTab);
  198. }
  199. wx.nextTick(function () {
  200. _this.setData({
  201. activeTab: tabIndex + 1,
  202. });
  203. });
  204. }
  205. this.setData({
  206. tabs: tabs,
  207. });
  208. var selectedOptions = tabs.map(function (tab) { return tab.selected; }).filter(Boolean);
  209. var value = option[valueKey];
  210. var params = {
  211. value: value,
  212. tabIndex: tabIndex,
  213. selectedOptions: selectedOptions,
  214. };
  215. this.innerValue = value;
  216. this.$emit('change', params);
  217. if (!option[childrenKey]) {
  218. this.$emit('finish', params);
  219. }
  220. },
  221. },
  222. });