d1026e01000ec4678e3a84cf90d0be071ce506345cd6b1a03c0fa6c1167e0090c15a9b7025443768e753f070e9e744976565f81b3bc5b20fb1053fafc0017d 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. import { defineComponent, inject, computed, openBlock, createElementBlock, unref, normalizeClass, createCommentVNode, createBlock, withModifiers, withCtx, createElementVNode, createVNode, Fragment } from 'vue';
  2. import { ElCheckbox } from '../../checkbox/index.mjs';
  3. import { ElRadio } from '../../radio/index.mjs';
  4. import { ElIcon } from '../../icon/index.mjs';
  5. import { Check, Loading, ArrowRight } from '@element-plus/icons-vue';
  6. import NodeContent from './node-content.mjs';
  7. import { CASCADER_PANEL_INJECTION_KEY } from './types.mjs';
  8. import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
  9. import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
  10. const __default__ = defineComponent({
  11. name: "ElCascaderNode"
  12. });
  13. const _sfc_main = /* @__PURE__ */ defineComponent({
  14. ...__default__,
  15. props: {
  16. node: {
  17. type: Object,
  18. required: true
  19. },
  20. menuId: String
  21. },
  22. emits: ["expand"],
  23. setup(__props, { emit }) {
  24. const props = __props;
  25. const panel = inject(CASCADER_PANEL_INJECTION_KEY);
  26. const ns = useNamespace("cascader-node");
  27. const isHoverMenu = computed(() => panel.isHoverMenu);
  28. const multiple = computed(() => panel.config.multiple);
  29. const checkStrictly = computed(() => panel.config.checkStrictly);
  30. const showPrefix = computed(() => panel.config.showPrefix);
  31. const checkedNodeId = computed(() => {
  32. var _a;
  33. return (_a = panel.checkedNodes[0]) == null ? void 0 : _a.uid;
  34. });
  35. const isDisabled = computed(() => props.node.isDisabled);
  36. const isLeaf = computed(() => props.node.isLeaf);
  37. const expandable = computed(() => checkStrictly.value && !isLeaf.value || !isDisabled.value);
  38. const inExpandingPath = computed(() => isInPath(panel.expandingNode));
  39. const inCheckedPath = computed(() => checkStrictly.value && panel.checkedNodes.some(isInPath));
  40. const isInPath = (node) => {
  41. var _a;
  42. const { level, uid } = props.node;
  43. return ((_a = node == null ? void 0 : node.pathNodes[level - 1]) == null ? void 0 : _a.uid) === uid;
  44. };
  45. const doExpand = () => {
  46. if (inExpandingPath.value)
  47. return;
  48. panel.expandNode(props.node);
  49. };
  50. const doCheck = (checked) => {
  51. const { node } = props;
  52. if (checked === node.checked)
  53. return;
  54. panel.handleCheckChange(node, checked);
  55. };
  56. const doLoad = () => {
  57. panel.lazyLoad(props.node, () => {
  58. if (!isLeaf.value)
  59. doExpand();
  60. });
  61. };
  62. const handleHoverExpand = (e) => {
  63. if (!isHoverMenu.value)
  64. return;
  65. handleExpand();
  66. !isLeaf.value && emit("expand", e);
  67. };
  68. const handleExpand = () => {
  69. const { node } = props;
  70. if (!expandable.value || node.loading)
  71. return;
  72. node.loaded ? doExpand() : doLoad();
  73. };
  74. const handleClick = () => {
  75. if (isLeaf.value && !isDisabled.value && !checkStrictly.value && !multiple.value) {
  76. handleCheck(true);
  77. } else if ((panel.config.checkOnClickNode && (multiple.value || checkStrictly.value) || isLeaf.value && panel.config.checkOnClickLeaf) && !isDisabled.value) {
  78. handleSelectCheck(!props.node.checked);
  79. } else if (!isHoverMenu.value) {
  80. handleExpand();
  81. }
  82. };
  83. const handleSelectCheck = (checked) => {
  84. if (checkStrictly.value) {
  85. doCheck(checked);
  86. if (props.node.loaded) {
  87. doExpand();
  88. }
  89. } else {
  90. handleCheck(checked);
  91. }
  92. };
  93. const handleCheck = (checked) => {
  94. if (!props.node.loaded) {
  95. doLoad();
  96. } else {
  97. doCheck(checked);
  98. !checkStrictly.value && doExpand();
  99. }
  100. };
  101. return (_ctx, _cache) => {
  102. return openBlock(), createElementBlock("li", {
  103. id: `${__props.menuId}-${__props.node.uid}`,
  104. role: "menuitem",
  105. "aria-haspopup": !unref(isLeaf),
  106. "aria-owns": unref(isLeaf) ? void 0 : __props.menuId,
  107. "aria-expanded": unref(inExpandingPath),
  108. tabindex: unref(expandable) ? -1 : void 0,
  109. class: normalizeClass([
  110. unref(ns).b(),
  111. unref(ns).is("selectable", unref(checkStrictly)),
  112. unref(ns).is("active", __props.node.checked),
  113. unref(ns).is("disabled", !unref(expandable)),
  114. unref(inExpandingPath) && "in-active-path",
  115. unref(inCheckedPath) && "in-checked-path"
  116. ]),
  117. onMouseenter: handleHoverExpand,
  118. onFocus: handleHoverExpand,
  119. onClick: handleClick
  120. }, [
  121. createCommentVNode(" prefix "),
  122. unref(multiple) && unref(showPrefix) ? (openBlock(), createBlock(unref(ElCheckbox), {
  123. key: 0,
  124. "model-value": __props.node.checked,
  125. indeterminate: __props.node.indeterminate,
  126. disabled: unref(isDisabled),
  127. onClick: withModifiers(() => {
  128. }, ["stop"]),
  129. "onUpdate:modelValue": handleSelectCheck
  130. }, null, 8, ["model-value", "indeterminate", "disabled", "onClick"])) : unref(checkStrictly) && unref(showPrefix) ? (openBlock(), createBlock(unref(ElRadio), {
  131. key: 1,
  132. "model-value": unref(checkedNodeId),
  133. label: __props.node.uid,
  134. disabled: unref(isDisabled),
  135. "onUpdate:modelValue": handleSelectCheck,
  136. onClick: withModifiers(() => {
  137. }, ["stop"])
  138. }, {
  139. default: withCtx(() => [
  140. createCommentVNode("\n Add an empty element to avoid render label,\n do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n "),
  141. createElementVNode("span")
  142. ]),
  143. _: 1
  144. }, 8, ["model-value", "label", "disabled", "onClick"])) : unref(isLeaf) && __props.node.checked ? (openBlock(), createBlock(unref(ElIcon), {
  145. key: 2,
  146. class: normalizeClass(unref(ns).e("prefix"))
  147. }, {
  148. default: withCtx(() => [
  149. createVNode(unref(Check))
  150. ]),
  151. _: 1
  152. }, 8, ["class"])) : createCommentVNode("v-if", true),
  153. createCommentVNode(" content "),
  154. createVNode(unref(NodeContent), { node: __props.node }, null, 8, ["node"]),
  155. createCommentVNode(" postfix "),
  156. !unref(isLeaf) ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
  157. __props.node.loading ? (openBlock(), createBlock(unref(ElIcon), {
  158. key: 0,
  159. class: normalizeClass([unref(ns).is("loading"), unref(ns).e("postfix")])
  160. }, {
  161. default: withCtx(() => [
  162. createVNode(unref(Loading))
  163. ]),
  164. _: 1
  165. }, 8, ["class"])) : (openBlock(), createBlock(unref(ElIcon), {
  166. key: 1,
  167. class: normalizeClass(["arrow-right", unref(ns).e("postfix")])
  168. }, {
  169. default: withCtx(() => [
  170. createVNode(unref(ArrowRight))
  171. ]),
  172. _: 1
  173. }, 8, ["class"]))
  174. ], 64)) : createCommentVNode("v-if", true)
  175. ], 42, ["id", "aria-haspopup", "aria-owns", "aria-expanded", "tabindex"]);
  176. };
  177. }
  178. });
  179. var ElCascaderNode = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "node.vue"]]);
  180. export { ElCascaderNode as default };
  181. //# sourceMappingURL=node2.mjs.map