kd-lane-chart-v3 0.0.2 → 0.0.4

package/dist/esm/index.js

@@ -342,7 +342,6 @@ const _sfc_main$c = {
       if (!menu) {
         return;
       }
-      console.log(this.positionInfo);
       const { left = 0, top = 0 } = this.positionInfo;
       if (!this.menuWidth || !this.menuHeight) {
         menu.style.visibility = "hidden";
@@ -351,17 +350,39 @@ const _sfc_main$c = {
         this.menuHeight = menu.offsetHeight;
         menu.removeAttribute("style");
       }
-      if (this.menuWidth + event.pageX >= window.innerWidth) {
-        menu.style.left = event.pageX - this.menuWidth - left + 2 + "px";
-      } else {
-        menu.style.left = event.pageX - left + 2 + "px";
+      const container = this.getContainer(menu);
+      const rect = container ? container.getBoundingClientRect() : { left: 0, top: 0, right: window.innerWidth, bottom: window.innerHeight };
+      const clientX = typeof event.clientX === "number" ? event.clientX : event.pageX;
+      const clientY = typeof event.clientY === "number" ? event.clientY : event.pageY;
+      const containerW = rect.right - rect.left;
+      const containerH = rect.bottom - rect.top;
+      let relX = clientX - rect.left - left + 2;
+      let relY = clientY - rect.top - top + 2;
+      if (relX + this.menuWidth > containerW) {
+        relX = clientX - rect.left - this.menuWidth - left + 2;
+      }
+      if (relY + this.menuHeight > containerH) {
+        relY = clientY - rect.top - this.menuHeight - top + 2;
+      }
+      const percentX = Math.max(0, relX) / containerW * 100;
+      const percentY = Math.max(0, relY) / containerH * 100;
+      menu.style.left = percentX + "%";
+      menu.style.top = percentY + "%";
+      menu.classList.add("vue-simple-context-menu--active");
+    },
+    // 以 .kd-lane-chart-container 作为定位父元素（其 position 为 relative）
+    getContainer(menu) {
+      if (menu.closest) {
+        return menu.closest(".kd-lane-chart-container");
       }
-      if (this.menuHeight + event.pageY >= window.innerHeight) {
-        menu.style.top = event.pageY - this.menuHeight - top + 2 + "px";
-      } else {
-        menu.style.top = event.pageY - top + 2 + "px";
+      let el = menu.parentElement;
+      while (el) {
+        if (el.classList && el.classList.contains("kd-lane-chart-container")) {
+          return el;
+        }
+        el = el.parentElement;
       }
-      menu.classList.add("vue-simple-context-menu--active");
+      return null;
     },
     hideContextMenu() {
       const element = this.$refs.refUl;
@@ -419,7 +440,7 @@ function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-const VueSimpleContextMenu = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$c], ["__scopeId", "data-v-00600889"]]);
+const VueSimpleContextMenu = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$c], ["__scopeId", "data-v-38ac9b6e"]]);
 class CustomStrategy {
   constructor(strategy) {
     this.strategy = strategy;
@@ -1819,7 +1840,7 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
             createVNode(_component_el_color_picker, {
               modelValue: $data.formData.lineColor,
               "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => $data.formData.lineColor = $event),
-              disabled: $data.formData.isGradient,
+              disabled: $data.formData.isGradient || $props.formDisable,
               class: "kd-color-picker-wrapper",
               "popper-class": "kd-color-picker"
             }, null, 8, ["modelValue", "disabled"])
@@ -1836,7 +1857,7 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
               modelValue: $data.formData.lineType,
               "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => $data.formData.lineType = $event),
               placeholder: "请选择",
-              disabled: $data.formData.isGradient,
+              disabled: $data.formData.isGradient || $props.formDisable,
               "popper-class": "kd-curve-2d-select-popup"
             }, {
               default: withCtx(() => [
@@ -1893,7 +1914,7 @@ function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-const LineEdit = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$a], ["__scopeId", "data-v-3405e8de"]]);
+const LineEdit = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$a], ["__scopeId", "data-v-36fe0bb1"]]);
 const _sfc_main$9 = {
   inject: ["upsertTemplate", "setTargetData", "setExpanded"],
   props: {
@@ -2216,7 +2237,8 @@ const _sfc_main$8 = {
       expandedKeys: [],
       currentNodeKey: "",
       targetData: void 0,
-      treeKey: ""
+      treeKey: "",
+      tooltipVisible: {}
     };
   },
   methods: {
@@ -2230,9 +2252,16 @@ const _sfc_main$8 = {
       }
       return nameConfig.paramName;
     },
+    handleMouseEnter(event, nodeId) {
+      const target = event.currentTarget;
+      const isOverflow = target.scrollWidth > target.offsetWidth;
+      this.tooltipVisible[nodeId] = isOverflow;
+    },
+    handleMouseLeave(_, nodeId) {
+      this.tooltipVisible[nodeId] = false;
+    },
     setTargetData(targetData) {
       this.targetData = targetData;
-      console.log(targetData, "333333333");
       this.setExpanded();
       const dataType = judgeRawDataType(targetData);
       switch (dataType) {
@@ -2493,9 +2522,11 @@ const _sfc_main$8 = {
   }
 };
 const _hoisted_1$8 = ["onContextmenu"];
-const _hoisted_2$7 = { style: { "padding-left": "5px" } };
-const _hoisted_3$5 = { class: "rtd-config-side-option" };
+const _hoisted_2$7 = ["onMouseover", "onMouseleave"];
+const _hoisted_3$5 = { style: { "padding-left": "5px" } };
+const _hoisted_4$5 = { class: "rtd-config-side-option" };
 function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_tooltip = resolveComponent("el-tooltip");
   const _component_Star = resolveComponent("Star");
   const _component_el_icon = resolveComponent("el-icon");
   const _component_el_tree = resolveComponent("el-tree");
@@ -2537,8 +2568,22 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
                 class: "custom-tree-node",
                 onContextmenu: withModifiers(($event) => $options.showRightWindows($event, data, node), ["prevent"])
               }, [
-                createElementVNode("span", null, toDisplayString(node.label), 1),
-                withDirectives(createElementVNode("span", _hoisted_2$7, [
+                createVNode(_component_el_tooltip, {
+                  content: node.label,
+                  placement: "right",
+                  manual: true,
+                  visible: $data.tooltipVisible[node.id]
+                }, {
+                  default: withCtx(() => [
+                    createElementVNode("span", {
+                      class: "tree-node-label",
+                      onMouseover: ($event) => $options.handleMouseEnter($event, node.id),
+                      onMouseleave: ($event) => $options.handleMouseLeave($event, node.id)
+                    }, toDisplayString(node.label), 41, _hoisted_2$7)
+                  ]),
+                  _: 2
+                }, 1032, ["content", "visible"]),
+                withDirectives(createElementVNode("span", _hoisted_3$5, [
                   createVNode(_component_el_icon, null, {
                     default: withCtx(() => [
                       createVNode(_component_Star)
@@ -2552,7 +2597,7 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
             ]),
             _: 1
           }, 8, ["data", "current-node-key", "default-expanded-keys", "onNodeClick", "onNodeExpand", "onNodeCollapse"])),
-          createElementVNode("div", _hoisted_3$5, [
+          createElementVNode("div", _hoisted_4$5, [
             createVNode(_component_el_button, { onClick: $options.addTemplate }, {
               default: withCtx(() => [..._cache[0] || (_cache[0] = [
                 createTextVNode("新增模板", -1)
@@ -2604,7 +2649,7 @@ function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
     [_directive_loading, $data.curveConfigLoading]
   ]);
 }
-const RealTimeCurveConfig = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$8], ["__scopeId", "data-v-8606346c"]]);
+const RealTimeCurveConfig = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$8], ["__scopeId", "data-v-1fb6ec88"]]);
 const ACTION_TYPE = {
   UPSERT_LINE: "upsertLine",
   DELETE_LINE: "delLine"
@@ -3965,7 +4010,7 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
     ], 2)) : createCommentVNode("", true)
   ], 544);
 }
-const KdLaneContainerComponent = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6], ["__scopeId", "data-v-424f38c2"]]);
+const KdLaneContainerComponent = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6], ["__scopeId", "data-v-192e257e"]]);
 const SLIDER_GROUP_ID = "depthSliderGroup";
 function pad2(n) {
   return n < 10 ? "0" + n : "" + n;