You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

135 lines
5.4 KiB

3 months ago
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var index$1 = require('../../icon/index.js');
  5. var iconsVue = require('@element-plus/icons-vue');
  6. var index$2 = require('../../checkbox/index.js');
  7. var treeNodeContent = require('./tree-node-content.js');
  8. var virtualTree = require('./virtual-tree.js');
  9. var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
  10. var index = require('../../../hooks/use-namespace/index.js');
  11. var shared = require('@vue/shared');
  12. const __default__ = vue.defineComponent({
  13. name: "ElTreeNode"
  14. });
  15. const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  16. ...__default__,
  17. props: virtualTree.treeNodeProps,
  18. emits: virtualTree.treeNodeEmits,
  19. setup(__props, { emit }) {
  20. const props = __props;
  21. const tree = vue.inject(virtualTree.ROOT_TREE_INJECTION_KEY);
  22. const ns = index.useNamespace("tree");
  23. const indent = vue.computed(() => {
  24. var _a;
  25. return (_a = tree == null ? void 0 : tree.props.indent) != null ? _a : 16;
  26. });
  27. const icon = vue.computed(() => {
  28. var _a;
  29. return (_a = tree == null ? void 0 : tree.props.icon) != null ? _a : iconsVue.CaretRight;
  30. });
  31. const getNodeClass = (node) => {
  32. const nodeClassFunc = tree == null ? void 0 : tree.props.props.class;
  33. if (!nodeClassFunc)
  34. return {};
  35. let className;
  36. if (shared.isFunction(nodeClassFunc)) {
  37. const { data } = node;
  38. className = nodeClassFunc(data, node);
  39. } else {
  40. className = nodeClassFunc;
  41. }
  42. return shared.isString(className) ? { [className]: true } : className;
  43. };
  44. const handleClick = (e) => {
  45. emit("click", props.node, e);
  46. };
  47. const handleDrop = (e) => {
  48. emit("drop", props.node, e);
  49. };
  50. const handleExpandIconClick = () => {
  51. emit("toggle", props.node);
  52. };
  53. const handleCheckChange = (value) => {
  54. emit("check", props.node, value);
  55. };
  56. const handleContextMenu = (event) => {
  57. var _a, _b, _c, _d;
  58. if ((_c = (_b = (_a = tree == null ? void 0 : tree.instance) == null ? void 0 : _a.vnode) == null ? void 0 : _b.props) == null ? void 0 : _c["onNodeContextmenu"]) {
  59. event.stopPropagation();
  60. event.preventDefault();
  61. }
  62. tree == null ? void 0 : tree.ctx.emit(virtualTree.NODE_CONTEXTMENU, event, (_d = props.node) == null ? void 0 : _d.data, props.node);
  63. };
  64. return (_ctx, _cache) => {
  65. var _a, _b, _c;
  66. return vue.openBlock(), vue.createElementBlock("div", {
  67. ref: "node$",
  68. class: vue.normalizeClass([
  69. vue.unref(ns).b("node"),
  70. vue.unref(ns).is("expanded", _ctx.expanded),
  71. vue.unref(ns).is("current", _ctx.current),
  72. vue.unref(ns).is("focusable", !_ctx.disabled),
  73. vue.unref(ns).is("checked", !_ctx.disabled && _ctx.checked),
  74. getNodeClass(_ctx.node)
  75. ]),
  76. role: "treeitem",
  77. tabindex: "-1",
  78. "aria-expanded": _ctx.expanded,
  79. "aria-disabled": _ctx.disabled,
  80. "aria-checked": _ctx.checked,
  81. "data-key": (_a = _ctx.node) == null ? void 0 : _a.key,
  82. onClick: vue.withModifiers(handleClick, ["stop"]),
  83. onContextmenu: handleContextMenu,
  84. onDragover: vue.withModifiers(() => {
  85. }, ["prevent"]),
  86. onDragenter: vue.withModifiers(() => {
  87. }, ["prevent"]),
  88. onDrop: vue.withModifiers(handleDrop, ["stop"])
  89. }, [
  90. vue.createElementVNode("div", {
  91. class: vue.normalizeClass(vue.unref(ns).be("node", "content")),
  92. style: vue.normalizeStyle({
  93. paddingLeft: `${(_ctx.node.level - 1) * vue.unref(indent)}px`,
  94. height: _ctx.itemSize + "px"
  95. })
  96. }, [
  97. vue.unref(icon) ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.ElIcon), {
  98. key: 0,
  99. class: vue.normalizeClass([
  100. vue.unref(ns).is("leaf", !!((_b = _ctx.node) == null ? void 0 : _b.isLeaf)),
  101. vue.unref(ns).is("hidden", _ctx.hiddenExpandIcon),
  102. {
  103. expanded: !((_c = _ctx.node) == null ? void 0 : _c.isLeaf) && _ctx.expanded
  104. },
  105. vue.unref(ns).be("node", "expand-icon")
  106. ]),
  107. onClick: vue.withModifiers(handleExpandIconClick, ["stop"])
  108. }, {
  109. default: vue.withCtx(() => [
  110. (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(icon))))
  111. ]),
  112. _: 1
  113. }, 8, ["class", "onClick"])) : vue.createCommentVNode("v-if", true),
  114. _ctx.showCheckbox ? (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElCheckbox), {
  115. key: 1,
  116. "model-value": _ctx.checked,
  117. indeterminate: _ctx.indeterminate,
  118. disabled: _ctx.disabled,
  119. onChange: handleCheckChange,
  120. onClick: vue.withModifiers(() => {
  121. }, ["stop"])
  122. }, null, 8, ["model-value", "indeterminate", "disabled", "onClick"])) : vue.createCommentVNode("v-if", true),
  123. vue.createVNode(vue.unref(treeNodeContent["default"]), { node: _ctx.node }, null, 8, ["node"])
  124. ], 6)
  125. ], 42, ["aria-expanded", "aria-disabled", "aria-checked", "data-key", "onClick", "onDragover", "onDragenter", "onDrop"]);
  126. };
  127. }
  128. });
  129. var ElTreeNode = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "tree-node.vue"]]);
  130. exports["default"] = ElTreeNode;
  131. //# sourceMappingURL=tree-node.js.map