index.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  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. activeTab: 0,
  165. });
  166. },
  167. onClose: function () {
  168. this.$emit('close');
  169. },
  170. onClickTab: function (e) {
  171. var _a = e.detail, tabIndex = _a.index, title = _a.title;
  172. this.$emit('click-tab', { title: title, tabIndex: tabIndex });
  173. this.setData({
  174. activeTab: tabIndex,
  175. });
  176. },
  177. // 选中
  178. onSelect: function (e) {
  179. var _this = this;
  180. var _a = e.currentTarget.dataset, option = _a.option, tabIndex = _a.tabIndex;
  181. if (option && option.disabled) {
  182. return;
  183. }
  184. var _b = this.data, valueKey = _b.valueKey, childrenKey = _b.childrenKey;
  185. var tabs = this.data.tabs;
  186. tabs[tabIndex].selected = option;
  187. if (tabs.length > tabIndex + 1) {
  188. tabs = tabs.slice(0, tabIndex + 1);
  189. }
  190. if (option[childrenKey]) {
  191. var nextTab = {
  192. options: option[childrenKey],
  193. selected: null,
  194. };
  195. if (tabs[tabIndex + 1]) {
  196. tabs[tabIndex + 1] = nextTab;
  197. }
  198. else {
  199. tabs.push(nextTab);
  200. }
  201. wx.nextTick(function () {
  202. _this.setData({
  203. activeTab: tabIndex + 1,
  204. });
  205. });
  206. }
  207. this.setData({
  208. tabs: tabs,
  209. });
  210. var selectedOptions = tabs.map(function (tab) { return tab.selected; }).filter(Boolean);
  211. var value = option[valueKey];
  212. var params = {
  213. value: value,
  214. tabIndex: tabIndex,
  215. selectedOptions: selectedOptions,
  216. };
  217. this.innerValue = value;
  218. this.$emit('change', params);
  219. if (!option[childrenKey]) {
  220. this.$emit('finish', params);
  221. }
  222. },
  223. },
  224. });