index.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = void 0;
  5. var _babelHelperVueJsxMergeProps = _interopRequireDefault(require("@vue/babel-helper-vue-jsx-merge-props"));
  6. var _utils = require("../utils");
  7. var _functional = require("../utils/functional");
  8. var _icon = _interopRequireDefault(require("../icon"));
  9. var _sidebar = _interopRequireDefault(require("../sidebar"));
  10. var _sidebarItem = _interopRequireDefault(require("../sidebar-item"));
  11. // Utils
  12. // Components
  13. var _createNamespace = (0, _utils.createNamespace)('tree-select'),
  14. createComponent = _createNamespace[0],
  15. bem = _createNamespace[1];
  16. function TreeSelect(h, props, slots, ctx) {
  17. var items = props.items,
  18. height = props.height,
  19. activeId = props.activeId,
  20. selectedIcon = props.selectedIcon,
  21. mainActiveIndex = props.mainActiveIndex;
  22. if (process.env.NODE_ENV === 'development') {
  23. if (ctx.listeners.navclick) {
  24. console.warn('[Vant] TreeSelect: "navclick" event is deprecated, use "click-nav" instead.');
  25. }
  26. if (ctx.listeners.itemclick) {
  27. console.warn('[Vant] TreeSelect: "itemclick" event is deprecated, use "click-item" instead.');
  28. }
  29. }
  30. var selectedItem = items[+mainActiveIndex] || {};
  31. var subItems = selectedItem.children || [];
  32. var isMultiple = Array.isArray(activeId);
  33. function isActiveItem(id) {
  34. return isMultiple ? activeId.indexOf(id) !== -1 : activeId === id;
  35. }
  36. var Navs = items.map(function (item) {
  37. var _item$badge;
  38. return h(_sidebarItem.default, {
  39. "attrs": {
  40. "dot": item.dot,
  41. "info": (_item$badge = item.badge) != null ? _item$badge : item.info,
  42. "title": item.text,
  43. "disabled": item.disabled
  44. },
  45. "class": [bem('nav-item'), item.className]
  46. });
  47. });
  48. function Content() {
  49. if (slots.content) {
  50. return slots.content();
  51. }
  52. return subItems.map(function (item) {
  53. return h("div", {
  54. "key": item.id,
  55. "class": ['van-ellipsis', bem('item', {
  56. active: isActiveItem(item.id),
  57. disabled: item.disabled
  58. })],
  59. "on": {
  60. "click": function click() {
  61. if (!item.disabled) {
  62. var newActiveId = item.id;
  63. if (isMultiple) {
  64. newActiveId = activeId.slice();
  65. var index = newActiveId.indexOf(item.id);
  66. if (index !== -1) {
  67. newActiveId.splice(index, 1);
  68. } else if (newActiveId.length < props.max) {
  69. newActiveId.push(item.id);
  70. }
  71. }
  72. (0, _functional.emit)(ctx, 'update:active-id', newActiveId);
  73. (0, _functional.emit)(ctx, 'click-item', item); // compatible with legacy usage, should be removed in next major version
  74. (0, _functional.emit)(ctx, 'itemclick', item);
  75. }
  76. }
  77. }
  78. }, [item.text, isActiveItem(item.id) && h(_icon.default, {
  79. "attrs": {
  80. "name": selectedIcon
  81. },
  82. "class": bem('selected')
  83. })]);
  84. });
  85. }
  86. return h("div", (0, _babelHelperVueJsxMergeProps.default)([{
  87. "class": bem(),
  88. "style": {
  89. height: (0, _utils.addUnit)(height)
  90. }
  91. }, (0, _functional.inherit)(ctx)]), [h(_sidebar.default, {
  92. "class": bem('nav'),
  93. "attrs": {
  94. "activeKey": mainActiveIndex
  95. },
  96. "on": {
  97. "change": function change(index) {
  98. (0, _functional.emit)(ctx, 'update:main-active-index', index);
  99. (0, _functional.emit)(ctx, 'click-nav', index); // compatible with legacy usage, should be removed in next major version
  100. (0, _functional.emit)(ctx, 'navclick', index);
  101. }
  102. }
  103. }, [Navs]), h("div", {
  104. "class": bem('content')
  105. }, [Content()])]);
  106. }
  107. TreeSelect.props = {
  108. max: {
  109. type: [Number, String],
  110. default: Infinity
  111. },
  112. items: {
  113. type: Array,
  114. default: function _default() {
  115. return [];
  116. }
  117. },
  118. height: {
  119. type: [Number, String],
  120. default: 300
  121. },
  122. activeId: {
  123. type: [Number, String, Array],
  124. default: 0
  125. },
  126. selectedIcon: {
  127. type: String,
  128. default: 'success'
  129. },
  130. mainActiveIndex: {
  131. type: [Number, String],
  132. default: 0
  133. }
  134. };
  135. var _default2 = createComponent(TreeSelect);
  136. exports.default = _default2;