@ibiz-template/vue3-components 0.7.41-alpha.5 → 0.7.41-alpha.7

package/es/panel-component/app-extend-menu/extend-menu-base/extend-menu-base.util.mjs

@@ -0,0 +1,339 @@
+import { ref, h, onMounted, onUnmounted } from 'vue';
+
+"use strict";
+function useCascaderPopover(props, ns, menuAlign, renderCascaderContent) {
+  let hoverCount = 0;
+  let closeTimer = null;
+  const overlayInstances = /* @__PURE__ */ new Map();
+  const activeMenuIdStack = ref([]);
+  const rotatedArrowElements = /* @__PURE__ */ new Map();
+  const getOverlayNum = () => {
+    return overlayInstances.size;
+  };
+  const getPopoverPlacement = (level) => {
+    switch (props.position) {
+      case "TOP":
+        return level > 0 ? "right-start" : "bottom-start";
+      case "BOTTOM":
+        return level > 0 ? "right-end" : "top-start";
+      case "RIGHT":
+        return "left-start";
+      case "LEFT":
+        return "right-start";
+      default:
+        return void 0;
+    }
+  };
+  const clearCloseTimer = () => {
+    if (closeTimer) {
+      clearTimeout(closeTimer);
+      closeTimer = null;
+    }
+  };
+  const resetArrowRotation = (ns2, key) => {
+    const arrow = rotatedArrowElements.get(key);
+    if (!arrow)
+      return;
+    arrow.classList.remove(ns2.is("rotate-arrow", true));
+    rotatedArrowElements.delete(key);
+  };
+  const rotateArrowIcon = (el, ns2, key) => {
+    if (el) {
+      el.classList.add(ns2.is("rotate-arrow", true));
+      rotatedArrowElements.set(key, el);
+    }
+  };
+  const closePopoverAtLevel = (key) => {
+    const overlay = overlayInstances.get(key);
+    if (overlay) {
+      overlay.dismiss();
+      overlayInstances.delete(key);
+      resetArrowRotation(ns, key);
+    }
+  };
+  const closeSubsequentPopovers = (currentLevel) => {
+    let level = currentLevel;
+    while (overlayInstances.get(level + 1)) {
+      level++;
+    }
+    for (let i = level; i >= currentLevel; i--) {
+      closePopoverAtLevel(i);
+    }
+  };
+  const closeAllPopovers = () => {
+    for (const key of overlayInstances.keys()) {
+      closePopoverAtLevel(key);
+    }
+    overlayInstances.clear();
+    activeMenuIdStack.value = [];
+    hoverCount = 0;
+  };
+  const scheduleDelayedClose = () => {
+    clearCloseTimer();
+    closeTimer = setTimeout(() => {
+      if (hoverCount <= 0) {
+        closeAllPopovers();
+      }
+    }, 300);
+  };
+  const clearAllCascader = () => {
+    closeAllPopovers();
+    clearCloseTimer();
+  };
+  const handleMenuItemMouseEnter = (_menu, event) => {
+    if (activeMenuIdStack.value.includes(_menu.id))
+      return;
+    activeMenuIdStack.value.push(_menu.id);
+    closeSubsequentPopovers(_menu.level);
+    if (_menu.children) {
+      openCascaderPopover(_menu, event);
+    }
+    clearCloseTimer();
+  };
+  const handleMenuItemMouseLeave = (_menu) => {
+    const index = activeMenuIdStack.value.indexOf(_menu.id);
+    if (index !== -1) {
+      activeMenuIdStack.value.splice(index, 1);
+    }
+    scheduleDelayedClose();
+  };
+  const onPopoverMouseEnter = () => {
+    hoverCount++;
+    clearCloseTimer();
+  };
+  const onPopoverMouseLeave = (_menu, _event) => {
+    hoverCount = Math.max(0, hoverCount - 1);
+    scheduleDelayedClose();
+  };
+  const openCascaderPopover = (menu, evt, opts) => {
+    var _a;
+    const overlay = ibiz.overlay.createPopover(
+      () => h(renderCascaderContent(menu), {
+        onMouseenter: onPopoverMouseEnter,
+        onMouseleave: onPopoverMouseLeave
+      }),
+      void 0,
+      {
+        width: "auto",
+        height: "auto",
+        noArrow: true,
+        placement: getPopoverPlacement(menu.level),
+        offsetOpts: 10,
+        ...opts,
+        modalClass: "".concat(ns.b("cascader-popover"), " ").concat(ns.is(
+          menuAlign.value,
+          true
+        ), " ").concat((opts == null ? void 0 : opts.modalClass) || "")
+      }
+    );
+    overlayInstances.set(menu.level, overlay);
+    overlay == null ? void 0 : overlay.present(evt.currentTarget);
+    rotateArrowIcon(
+      (_a = evt.currentTarget) == null ? void 0 : _a.parentElement,
+      ns,
+      menu.level
+    );
+  };
+  return {
+    getOverlayNum,
+    openCascaderPopover,
+    clearAllCascader,
+    handleMenuItemMouseEnter,
+    handleMenuItemMouseLeave
+  };
+}
+function useBorderLayout(menuRef, ns, position, menuAlign, getOverlayNum, renderBorderContent) {
+  let overlay;
+  const getElementAbsolutePosition = (element) => {
+    let x = 0;
+    let y = 0;
+    let current = element;
+    while (current) {
+      x += current.offsetLeft;
+      y += current.offsetTop;
+      current = current.offsetParent;
+    }
+    return {
+      x,
+      y,
+      width: element.offsetWidth,
+      height: element.offsetHeight
+    };
+  };
+  const resolvePopoverPlacement = () => {
+    switch (position) {
+      case "TOP":
+        return "bottom";
+      case "BOTTOM":
+        return "top";
+      case "RIGHT":
+        return "left";
+      case "LEFT":
+        return "right";
+      default:
+        return void 0;
+    }
+  };
+  let popoverEl;
+  const closeBorderPopover = () => {
+    overlay == null ? void 0 : overlay.dismiss();
+    overlay = null;
+    document.removeEventListener("mousemove", handleMouseTrackOut);
+    popoverEl = void 0;
+  };
+  const handleMouseTrackOut = (e) => {
+    if (!popoverEl) {
+      popoverEl = document.querySelector(
+        ".".concat(ns.b("border-popover"))
+      );
+    }
+    const pos = getElementAbsolutePosition(popoverEl);
+    const isInside = e.pageX >= pos.x && e.pageX <= pos.x + pos.width && e.pageY >= pos.y && e.pageY <= pos.y + pos.height;
+    if (!isInside && getOverlayNum() <= 0) {
+      closeBorderPopover();
+    }
+  };
+  const handlePlaceholderMouseEnter = async (evt) => {
+    var _a;
+    if (overlay)
+      return;
+    overlay = ibiz.overlay.createPopover(
+      () => h(renderBorderContent()),
+      void 0,
+      {
+        width: "auto",
+        height: "auto",
+        noArrow: true,
+        placement: resolvePopoverPlacement(),
+        offsetOpts: -1,
+        modalClass: "".concat(ns.b("border-popover"), " ").concat(ns.is(menuAlign.value, true))
+      }
+    );
+    const triggerEl = (_a = evt.currentTarget) == null ? void 0 : _a.querySelector(
+      ".".concat(ns.be("placehold", "line"))
+    );
+    await (overlay == null ? void 0 : overlay.present(triggerEl));
+    setTimeout(() => {
+      document.addEventListener("mousemove", handleMouseTrackOut);
+    }, 200);
+  };
+  let placeholderEl = null;
+  let resizeObserver = null;
+  let frameLoopId = null;
+  const minWidth = 20;
+  const minHeight = 20;
+  const computeTop = (top, height) => {
+    return position === "BOTTOM" ? top + height - minHeight : top;
+  };
+  const computeLeft = (left, width) => {
+    return position === "RIGHT" ? left + width - minWidth : left;
+  };
+  const computeWidth = (width) => {
+    return ["RIGHT", "LEFT"].includes(position) ? minWidth : width;
+  };
+  const computeHeight = (height) => {
+    return ["TOP", "BOTTOM"].includes(position) ? minHeight : height;
+  };
+  function createFixedPlaceholder(el) {
+    const container = document.createElement("div");
+    container.classList.add(ns.b("placehold"));
+    container.classList.add(ns.is(position.toLowerCase(), !!position));
+    const line = document.createElement("div");
+    line.classList.add(ns.be("placehold", "line"));
+    const arrow = document.createElement("div");
+    arrow.classList.add(ns.be("placehold", "arrow"));
+    container.appendChild(line);
+    container.appendChild(arrow);
+    document.body.appendChild(container);
+    placeholderEl = container;
+    placeholderEl.addEventListener("mouseenter", handlePlaceholderMouseEnter);
+    arrow.innerHTML = '\n      <svg xmlns="http://www.w3.org/2000/svg"\n           viewBox="0 0 1024 1024"\n           width="1em"\n           height="1em"\n           fill="currentColor">\n        <path fill="currentColor"\n              d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z">\n        </path>\n      </svg>\n    ';
+    updatePlaceholderPosition(el);
+  }
+  function updatePlaceholderPosition(el) {
+    if (!placeholderEl)
+      return;
+    const rect = el.getBoundingClientRect();
+    placeholderEl.style.top = "".concat(computeTop(rect.top, rect.height), "px");
+    placeholderEl.style.left = "".concat(computeLeft(rect.left, rect.width), "px");
+    placeholderEl.style.width = "".concat(computeWidth(rect.width), "px");
+    placeholderEl.style.height = "".concat(computeHeight(rect.height), "px");
+  }
+  function startTracking() {
+    const el = menuRef.value;
+    if (!el)
+      return;
+    createFixedPlaceholder(el);
+    resizeObserver = new ResizeObserver(() => updatePlaceholderPosition(el));
+    resizeObserver.observe(el);
+    const updateLoop = () => {
+      updatePlaceholderPosition(el);
+      frameLoopId = requestAnimationFrame(updateLoop);
+    };
+    frameLoopId = requestAnimationFrame(updateLoop);
+  }
+  function stopTrackingAndDestroy() {
+    if (resizeObserver) {
+      const el = menuRef.value;
+      if (el)
+        resizeObserver.unobserve(el);
+      resizeObserver.disconnect();
+      resizeObserver = null;
+    }
+    if (frameLoopId !== null) {
+      cancelAnimationFrame(frameLoopId);
+      frameLoopId = null;
+    }
+    if (placeholderEl && placeholderEl.parentNode) {
+      placeholderEl.removeEventListener(
+        "mouseenter",
+        handlePlaceholderMouseEnter
+      );
+      placeholderEl.parentNode.removeChild(placeholderEl);
+      placeholderEl = null;
+    }
+  }
+  onMounted(startTracking);
+  onUnmounted(stopTrackingAndDestroy);
+  return { closeBorderPopover };
+}
+function getMenus(items, _parentItem, level = 0) {
+  return items.map((item) => {
+    var _a;
+    const data = {
+      ...item,
+      value: item.id,
+      label: item.caption,
+      parentId: _parentItem == null ? void 0 : _parentItem.id,
+      level
+    };
+    if ((_a = item.appMenuItems) == null ? void 0 : _a.length) {
+      data.children = getMenus(item.appMenuItems, item, level + 1);
+    }
+    return data;
+  });
+}
+function findMenuItem(_id, items) {
+  let temp;
+  if (items) {
+    items.some((item) => {
+      if (!item.id)
+        return true;
+      if (item.id === _id) {
+        temp = item;
+        return true;
+      }
+      if (item.appMenuItems && item.appMenuItems.length > 0) {
+        temp = findMenuItem(_id, item.appMenuItems);
+        if (!temp) {
+          return false;
+        }
+        return true;
+      }
+      return false;
+    });
+  }
+  return temp;
+}
+
+export { findMenuItem, getMenus, useBorderLayout, useCascaderPopover };

package/es/panel-component/app-extend-menu/left-side-menu/left-side-menu.css

@@ -1 +1 @@
-.ibiz-left-side-menu{width:100%;height:100%}
+.ibiz-left-side-menu{width:100%;height:100%}.ibiz-col--self-align>.ibiz-left-side-menu{width:100%;height:100%}

package/es/panel-component/app-extend-menu/right-side-menu/right-side-menu.css

@@ -1 +1 @@
-.ibiz-right-side-menu{width:100%;height:100%}
+.ibiz-right-side-menu{width:100%;height:100%}.ibiz-col--self-align>.ibiz-right-side-menu{width:100%;height:100%}

package/es/panel-component/app-extend-menu/top-side-menu/top-side-menu.css

@@ -1 +1 @@
-.ibiz-top-side-menu{width:100%;height:100%}
+.ibiz-top-side-menu{width:100%;height:100%}.ibiz-col--self-align>.ibiz-top-side-menu{width:100%;height:100%}

package/es/util/app-util/app-util.mjs

@@ -1,6 +1,6 @@
 import { getDeACMode, calcDeCodeNameById, ConfigService, UIActionUtil, SysUIActionTag } from '@ibiz-template/runtime';
 import { createUUID } from 'qx-util';
-import { CoreConst, getAppCookie, IBizContext } from '@ibiz-template/core';
+import { IBizContext } from '@ibiz-template/core';
 import { route2routePath, useUIStore } from '@ibiz-template/vue3-util';
 import { calcAiToolbarItemsByAc } from '../ai-util/ai-util.mjs';
 
@@ -381,13 +381,7 @@ class AppUtil {
                 (options == null ? void 0 : options.params) || params,
                 {}
               );
-              const headers = {};
-              const token = getAppCookie(CoreConst.TOKEN);
-              if (token) {
-                Object.assign(headers, {
-                  ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(token)
-                });
-              }
+              const headers = ibiz.util.file.getUploadHeaders();
               const formData = new FormData();
               formData.append("file", file);
               const res = await ibiz.net.axios({

package/es/util/fullscreen/fullscreen-util.mjs

@@ -1,6 +1,6 @@
 import { createApp } from 'vue';
 import ElementPlus from 'element-plus';
-import { defaultNamespace } from '../../node_modules/.pnpm/@ibiz-template_core@0.7.41-alpha.2_axios@1.6.8_lodash-es@4.17.21_qs@6.11.2_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.mjs';
+import { defaultNamespace } from '../../node_modules/.pnpm/@ibiz-template_core@0.7.41-alpha.7_axios@1.6.8_lodash-es@4.17.21_qs@6.11.2_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.mjs';
 import { IBizFullscreenToolbar } from '../../common/fullscreen-toolbar/fullscreen-toolbar.mjs';
 
 "use strict";

package/es/util/notification-util/upload-manager/upload-manager.mjs

@@ -1,6 +1,5 @@
 import { ref, computed, watch, onMounted, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
-import { CoreConst, getAppCookie } from '@ibiz-template/core';
 import { getFileSvgByType } from './file-type.mjs';
 import './upload-manager.css';
 
@@ -55,10 +54,7 @@ const IBizUploadManager = /* @__PURE__ */ defineComponent({
     const uploadFile = async (item) => {
       const data = new FormData();
       data.append("file", item.file);
-      const headers = {
-        ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(getAppCookie(CoreConst.TOKEN)),
-        ...props.params.headers
-      };
+      const headers = ibiz.util.file.getUploadHeaders();
       const res = await ibiz.net.axios({
         url: props.params.uploadUrl,
         method: "post",

package/es/web-app/util/unauthorized-handler/unauthorized-handler.mjs

@@ -108,7 +108,7 @@ class UnauthorizedHandler {
     if (error instanceof HttpError) {
       if (error.status === 401) {
         const search = qs.parse(window.location.search.replace("?", ""));
-        if (search.isAnonymous) {
+        if (search.isAnonymous || ibiz.env.enableAnonymous) {
           ibiz.auth.anonymousLogin().then((bol) => {
             if (bol) {
               window.location.reload();

package/lib/common/data-import2/data-import2.cjs

@@ -236,8 +236,9 @@ const DataImport2 = /* @__PURE__ */ vue.defineComponent({
       }
       columnMappingListQuery();
     });
+    const uploadHeaders = ibiz.util.file.getUploadHeaders();
     const headers = vue.ref({
-      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(core.getAppCookie(core.CoreConst.TOKEN))
+      ...uploadHeaders
     });
     const UploadUrl = vue.computed(() => {
       let uploadFileUrl;

package/lib/common/editor-empty-text/editor-empty-text.cjs

@@ -0,0 +1,33 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./editor-empty-text.css');
+
+"use strict";
+const IBizEditorEmptyText = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizEditorEmptyText",
+  props: {
+    showPlaceholder: {
+      type: Boolean,
+      default: false
+    },
+    placeHolder: {
+      type: String,
+      default: ""
+    }
+  },
+  setup() {
+    const ns = vue3Util.useNamespace("editor-empty-text");
+    return {
+      ns
+    };
+  },
+  render() {
+    return vue.createVNode("span", {
+      "class": [this.ns.b(), this.ns.is("placeholder", this.showPlaceholder)]
+    }, [this.showPlaceholder && this.placeHolder ? this.placeHolder : ibiz.config.common.emptyText]);
+  }
+});
+
+exports.IBizEditorEmptyText = IBizEditorEmptyText;

package/lib/common/editor-empty-text/editor-empty-text.css

@@ -0,0 +1 @@
+.ibiz-editor-empty-text.is-placeholder{color:var(--ibiz-color-text-3);white-space:nowrap}

package/lib/common/index.cjs

@@ -36,10 +36,12 @@ var controlNavigation = require('./control-navigation/control-navigation.cjs');
 var ganttSetting = require('./gantt-setting/gantt-setting.cjs');
 var navSplit = require('./nav-split/nav-split.cjs');
 var cropping = require('./cropping/cropping.cjs');
+var editorEmptyText = require('./editor-empty-text/editor-empty-text.cjs');
 
 "use strict";
 const IBizCommonComponents = {
   install: (v) => {
+    v.component(editorEmptyText.IBizEditorEmptyText.name, editorEmptyText.IBizEditorEmptyText);
     v.component(cropping.IBizCropping.name, cropping.IBizCropping);
     v.component(vue3Util.IBizControlBase.name, vue3Util.IBizControlBase);
     v.component(quickEdit.IBizQuickEdit.name, quickEdit.IBizQuickEdit);

package/lib/control/drtab/drtab-control.util.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var vue = require('vue');
-var namespace = require('../../node_modules/.pnpm/@ibiz-template_core@0.7.41-alpha.2_axios@1.6.8_lodash-es@4.17.21_qs@6.11.2_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.cjs');
+var namespace = require('../../node_modules/.pnpm/@ibiz-template_core@0.7.41-alpha.7_axios@1.6.8_lodash-es@4.17.21_qs@6.11.2_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.cjs');
 
 "use strict";
 function useAppDRTab(c, controlRef, counterData) {

package/lib/control/tree/el-tree-util.cjs

@@ -172,6 +172,40 @@ function getNewNodeControlPanel(control) {
     }
   }
 }
+function useLoadMoreUtil(treeRef, c) {
+  const toLoadMoreNode = (parentId) => {
+    const _loadMoreNodeData = {
+      _id: "".concat(parentId, "_load_more"),
+      _text: ibiz.i18n.t("control.common.loadMore"),
+      _leaf: true,
+      _disableSelect: true,
+      _load_more: true
+    };
+    return _loadMoreNodeData;
+  };
+  const addLoadMoreNode = (parentId, parentNode) => {
+    if (!treeRef.value || !parentId || !parentNode) {
+      return;
+    }
+    const _loadMoreNodeData = toLoadMoreNode(parentId);
+    if (treeRef.value.getNode(_loadMoreNodeData)) {
+      treeRef.value.remove(_loadMoreNodeData);
+    }
+    const infoItems = c.getLoadMoreInfoItems(parentId);
+    if (infoItems) {
+      const result = infoItems.some((infoItem) => {
+        return infoItem.curPage < infoItem.totalPage - 1;
+      });
+      if (result) {
+        treeRef.value.append(_loadMoreNodeData, parentNode);
+      }
+    }
+  };
+  return {
+    toLoadMoreNode,
+    addLoadMoreNode
+  };
+}
 
 exports.findChildItems = findChildItems;
 exports.findNodeData = findNodeData;
@@ -180,3 +214,4 @@ exports.getNewNodeControlPanel = getNewNodeControlPanel;
 exports.getNodeControlPanel = getNodeControlPanel;
 exports.useAppTreeBase = useAppTreeBase;
 exports.useElTreeUtil = useElTreeUtil;
+exports.useLoadMoreUtil = useLoadMoreUtil;

package/lib/control/tree/tree.cjs

@@ -307,6 +307,9 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
       updateUI,
       triggerNodeExpand
     } = elTreeUtil.useElTreeUtil(treeRef, c);
+    const {
+      addLoadMoreNode
+    } = elTreeUtil.useLoadMoreUtil(treeRef, c);
     const toElNodes = (nodes) => {
       return nodes.map((node) => ({
         _id: node._id,
@@ -325,6 +328,9 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
         const elNodes = toElNodes(children);
         treeRef.value.updateKeyChildren(parentNode._id, elNodes);
         updateUI();
+        vue.nextTick(() => {
+          addLoadMoreNode(parentNode._id, parentNode);
+        });
       }
     });
     c.evt.on("onAfterNodeDrop", (event) => {
@@ -388,6 +394,10 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
       ibiz.log.debug("\u7ED9\u6811\u8FD4\u56DE\u503C", nodes);
       callback(toElNodes(nodes));
       updateUI();
+      vue.nextTick(() => {
+        var _a, _b, _c;
+        addLoadMoreNode(item.level === 0 ? (_b = (_a = c.state.rootNodes) == null ? void 0 : _a[0]) == null ? void 0 : _b._id : (_c = item.data) == null ? void 0 : _c._id, item);
+      });
     };
     let selectionWait = false;
     c.evt.on("onLoadSuccess", () => {
@@ -635,12 +645,20 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
       debounceSearch();
     };
     const allowDrop = (draggingNode, dropNode, type) => {
+      var _a;
+      if ((_a = dropNode.data) == null ? void 0 : _a._load_more) {
+        return false;
+      }
       const draggingNodeData = elTreeUtil.findNodeData(draggingNode.data._uuid, c);
       const dropNodeData = elTreeUtil.findNodeData(dropNode.data._uuid, c);
       const result = c.calcAllowDrop(draggingNodeData, dropNodeData, type);
       return result;
     };
     const allowDrag = (draggingNode) => {
+      var _a;
+      if ((_a = draggingNode.data) == null ? void 0 : _a._load_more) {
+        return false;
+      }
       const nodeData = elTreeUtil.findNodeData(draggingNode.data._uuid, c);
       return c.calcAllowDrag(nodeData);
     };
@@ -726,6 +744,28 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
         }
       }, null)]);
     };
+    const handleLoadMore = async (e, item) => {
+      var _a, _b;
+      e.stopPropagation();
+      if (!item) {
+        return;
+      }
+      if (item.level === 0) {
+        await c.loadNodes(void 0, true);
+        return;
+      }
+      const nodeData = elTreeUtil.findNodeData((_a = item.data) == null ? void 0 : _a._uuid, c);
+      if (!nodeData) {
+        return;
+      }
+      await c.loadNodes(nodeData, true);
+      const elNodes = toElNodes(nodeData._children || []);
+      (_b = treeRef.value) == null ? void 0 : _b.updateKeyChildren(nodeData._id, elNodes);
+      updateUI();
+      vue.nextTick(() => {
+        addLoadMoreNode(nodeData._id, nodeData);
+      });
+    };
     return {
       c,
       ns,
@@ -754,7 +794,8 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
       handleDrop,
       onNodeTextEditBlur,
       renderNewNode,
-      handleEditKeyDown
+      handleEditKeyDown,
+      handleLoadMore
     };
   },
   render() {
@@ -796,7 +837,13 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
             label: "_text",
             children: "_children",
             isLeaf: "_leaf",
-            disabled: "_disableSelect"
+            disabled: "_disableSelect",
+            class: (data) => {
+              if (data == null ? void 0 : data._load_more) {
+                return this.ns.is("load-more", true);
+              }
+              return "";
+            }
           },
           "lazy": true,
           "load": this.loadData,
@@ -813,9 +860,18 @@ const TreeControl = /* @__PURE__ */ vue.defineComponent({
           "onNodeDrop": this.handleDrop
         }, this.$attrs), {
           default: ({
-            data
+            data,
+            node
           }) => {
             var _a, _b;
+            if (data._load_more) {
+              return vue.createVNode("div", {
+                "class": this.ns.b("node"),
+                "onClick": (e) => {
+                  this.handleLoadMore(e, node == null ? void 0 : node.parent);
+                }
+              }, [data._text]);
+            }
             if (this.newNodeKey === data._id)
               return this.renderNewNode();
             const nodeData = this.findNodeData(data._uuid, this.c);