index.js 7.4 KB

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