tree.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var lodashUnified = require('lodash-unified');
  5. var index = require('../../tree/index.js');
  6. var treeSelectOption = require('./tree-select-option.js');
  7. var utils = require('./utils.js');
  8. var strings = require('../../../utils/strings.js');
  9. var event = require('../../../constants/event.js');
  10. var shared = require('@vue/shared');
  11. var types = require('../../../utils/types.js');
  12. const useTree = (props, { attrs, slots, emit }, {
  13. select,
  14. tree,
  15. key
  16. }) => {
  17. vue.watch(() => props.modelValue, () => {
  18. if (props.showCheckbox) {
  19. vue.nextTick(() => {
  20. const treeInstance = tree.value;
  21. if (treeInstance && !lodashUnified.isEqual(treeInstance.getCheckedKeys(), utils.toValidArray(props.modelValue))) {
  22. treeInstance.setCheckedKeys(utils.toValidArray(props.modelValue));
  23. }
  24. });
  25. }
  26. }, {
  27. immediate: true,
  28. deep: true
  29. });
  30. const propsMap = vue.computed(() => ({
  31. value: key.value,
  32. label: "label",
  33. children: "children",
  34. disabled: "disabled",
  35. isLeaf: "isLeaf",
  36. ...props.props
  37. }));
  38. const getNodeValByProp = (prop, data) => {
  39. var _a;
  40. const propVal = propsMap.value[prop];
  41. if (shared.isFunction(propVal)) {
  42. return propVal(data, (_a = tree.value) == null ? void 0 : _a.getNode(getNodeValByProp("value", data)));
  43. } else {
  44. return data[propVal];
  45. }
  46. };
  47. const defaultExpandedParentKeys = utils.toValidArray(props.modelValue).map((value) => {
  48. return utils.treeFind(props.data || [], (data) => getNodeValByProp("value", data) === value, (data) => getNodeValByProp("children", data), (data, index, array, parent) => parent && getNodeValByProp("value", parent));
  49. }).filter((item) => utils.isValidValue(item));
  50. const cacheOptions = vue.computed(() => {
  51. if (!props.renderAfterExpand && !props.lazy)
  52. return [];
  53. const options = [];
  54. utils.treeEach(props.data.concat(props.cacheData), (node) => {
  55. const value = getNodeValByProp("value", node);
  56. options.push({
  57. value,
  58. currentLabel: getNodeValByProp("label", node),
  59. isDisabled: getNodeValByProp("disabled", node)
  60. });
  61. }, (data) => getNodeValByProp("children", data));
  62. return options;
  63. });
  64. const getChildCheckedKeys = () => {
  65. var _a;
  66. return (_a = tree.value) == null ? void 0 : _a.getCheckedKeys().filter((checkedKey) => {
  67. var _a2;
  68. const node = (_a2 = tree.value) == null ? void 0 : _a2.getNode(checkedKey);
  69. return !lodashUnified.isNil(node) && types.isEmpty(node.childNodes);
  70. });
  71. };
  72. return {
  73. ...lodashUnified.pick(vue.toRefs(props), Object.keys(index.ElTree.props)),
  74. ...attrs,
  75. nodeKey: key,
  76. expandOnClickNode: vue.computed(() => {
  77. return !props.checkStrictly && props.expandOnClickNode;
  78. }),
  79. defaultExpandedKeys: vue.computed(() => {
  80. return props.defaultExpandedKeys ? props.defaultExpandedKeys.concat(defaultExpandedParentKeys) : defaultExpandedParentKeys;
  81. }),
  82. renderContent: (h, { node, data, store }) => {
  83. return h(treeSelectOption["default"], {
  84. value: getNodeValByProp("value", data),
  85. label: getNodeValByProp("label", data),
  86. disabled: getNodeValByProp("disabled", data),
  87. visible: node.visible
  88. }, props.renderContent ? () => props.renderContent(h, { node, data, store }) : slots.default ? () => slots.default({ node, data, store }) : void 0);
  89. },
  90. filterNodeMethod: (value, data, node) => {
  91. if (props.filterNodeMethod)
  92. return props.filterNodeMethod(value, data, node);
  93. if (!value)
  94. return true;
  95. const regexp = new RegExp(strings.escapeStringRegexp(value), "i");
  96. return regexp.test(getNodeValByProp("label", data) || "");
  97. },
  98. onNodeClick: (data, node, e) => {
  99. var _a, _b, _c, _d;
  100. (_a = attrs.onNodeClick) == null ? void 0 : _a.call(attrs, data, node, e);
  101. if (props.showCheckbox && props.checkOnClickNode)
  102. return;
  103. if (!props.showCheckbox && (props.checkStrictly || node.isLeaf)) {
  104. if (!getNodeValByProp("disabled", data)) {
  105. const option = (_b = select.value) == null ? void 0 : _b.states.options.get(getNodeValByProp("value", data));
  106. (_c = select.value) == null ? void 0 : _c.handleOptionSelect(option);
  107. }
  108. } else if (props.expandOnClickNode) {
  109. e.proxy.handleExpandIconClick();
  110. }
  111. (_d = select.value) == null ? void 0 : _d.focus();
  112. },
  113. onCheck: (data, params) => {
  114. var _a;
  115. if (!props.showCheckbox)
  116. return;
  117. const dataValue = getNodeValByProp("value", data);
  118. const dataMap = {};
  119. utils.treeEach([tree.value.store.root], (node) => dataMap[node.key] = node, (node) => node.childNodes);
  120. const uncachedCheckedKeys = params.checkedKeys;
  121. const cachedKeys = props.multiple ? utils.toValidArray(props.modelValue).filter((item) => !(item in dataMap) && !uncachedCheckedKeys.includes(item)) : [];
  122. const checkedKeys = cachedKeys.concat(uncachedCheckedKeys);
  123. if (props.checkStrictly) {
  124. emit(event.UPDATE_MODEL_EVENT, props.multiple ? checkedKeys : checkedKeys.includes(dataValue) ? dataValue : void 0);
  125. } else {
  126. if (props.multiple) {
  127. const childKeys = getChildCheckedKeys();
  128. emit(event.UPDATE_MODEL_EVENT, cachedKeys.concat(childKeys));
  129. } else {
  130. const firstLeaf = utils.treeFind([data], (data2) => !utils.isValidArray(getNodeValByProp("children", data2)) && !getNodeValByProp("disabled", data2), (data2) => getNodeValByProp("children", data2));
  131. const firstLeafKey = firstLeaf ? getNodeValByProp("value", firstLeaf) : void 0;
  132. const hasCheckedChild = utils.isValidValue(props.modelValue) && !!utils.treeFind([data], (data2) => getNodeValByProp("value", data2) === props.modelValue, (data2) => getNodeValByProp("children", data2));
  133. emit(event.UPDATE_MODEL_EVENT, firstLeafKey === props.modelValue || hasCheckedChild ? void 0 : firstLeafKey);
  134. }
  135. }
  136. vue.nextTick(() => {
  137. var _a2;
  138. const checkedKeys2 = utils.toValidArray(props.modelValue);
  139. tree.value.setCheckedKeys(checkedKeys2);
  140. (_a2 = attrs.onCheck) == null ? void 0 : _a2.call(attrs, data, {
  141. checkedKeys: tree.value.getCheckedKeys(),
  142. checkedNodes: tree.value.getCheckedNodes(),
  143. halfCheckedKeys: tree.value.getHalfCheckedKeys(),
  144. halfCheckedNodes: tree.value.getHalfCheckedNodes()
  145. });
  146. });
  147. (_a = select.value) == null ? void 0 : _a.focus();
  148. },
  149. onNodeExpand: (data, node, e) => {
  150. var _a;
  151. (_a = attrs.onNodeExpand) == null ? void 0 : _a.call(attrs, data, node, e);
  152. vue.nextTick(() => {
  153. if (!props.checkStrictly && props.lazy && props.multiple && node.checked) {
  154. const dataMap = {};
  155. const uncachedCheckedKeys = tree.value.getCheckedKeys();
  156. utils.treeEach([tree.value.store.root], (node2) => dataMap[node2.key] = node2, (node2) => node2.childNodes);
  157. const cachedKeys = utils.toValidArray(props.modelValue).filter((item) => !(item in dataMap) && !uncachedCheckedKeys.includes(item));
  158. const childKeys = getChildCheckedKeys();
  159. emit(event.UPDATE_MODEL_EVENT, cachedKeys.concat(childKeys));
  160. }
  161. });
  162. },
  163. cacheOptions
  164. };
  165. };
  166. exports.useTree = useTree;
  167. //# sourceMappingURL=tree.js.map