kd-curve-v2 0.0.6 → 0.0.8

package/dist/esm/index.js

@@ -2175,7 +2175,7 @@ var script$a = {
   },
 };
 
-var css_248z$b = "@charset \"UTF-8\";\n.function-control-panel[data-v-682ce335] {\n  width: 100%;\n  height: 100%;\n  color: var(--text-color);\n  font-size: 14px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  /* 隐藏滚动条 */\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.function-control-panel[data-v-682ce335]::-webkit-scrollbar {\n  display: none;\n}\n.function-control-panel .radio-group[data-v-682ce335] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding-bottom: 8px;\n}\n.el-select-disabled[data-v-682ce335] {\n  opacity: 0.5;\n}\n\n/*/* 分割线 */\n.divider[data-v-682ce335] {\n  height: 1px;\n  background: var(--border-color);\n  margin-bottom: 8px;\n}\n\n/* label */\n.label[data-v-682ce335] {\n  color: #aaa;\n  margin-bottom: 2px;\n}\n\n/* 操作按钮 */\n.actions[data-v-682ce335] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.btn[data-v-682ce335] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 2px;\n  text-align: center;\n  font-family: Microsoft YaHei UI, Microsoft YaHei UI;\n  font-weight: 400;\n  cursor: pointer;\n}\n.btn .icon[data-v-682ce335] {\n  width: 54px;\n  height: 54px;\n}\n.btn.disabled[data-v-682ce335] {\n  color: #666;\n  cursor: not-allowed;\n}\n.btn.disabled .icon[data-v-682ce335] {\n  opacity: 0.5;\n}\n.fontColor[data-v-682ce335] {\n  color: var(--default-text-color);\n}";
+var css_248z$b = "@charset \"UTF-8\";\n.function-control-panel[data-v-9e2c85ea] {\n  width: 100%;\n  height: 100%;\n  color: var(--text-color);\n  font-size: 14px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  /* 隐藏滚动条 */\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.function-control-panel[data-v-9e2c85ea]::-webkit-scrollbar {\n  display: none;\n}\n.function-control-panel .radio-group[data-v-9e2c85ea] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding-bottom: 8px;\n}\n.el-select-disabled[data-v-9e2c85ea] {\n  opacity: 0.5;\n}\n\n/*/* 分割线 */\n.divider[data-v-9e2c85ea] {\n  height: 1px;\n  background: var(--border-color);\n  margin-bottom: 8px;\n}\n\n/* label */\n.label[data-v-9e2c85ea] {\n  color: #aaa;\n  margin-bottom: 2px;\n}\n\n/* 操作按钮 */\n.actions[data-v-9e2c85ea] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.btn[data-v-9e2c85ea] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 2px;\n  text-align: center;\n  font-family: Microsoft YaHei UI, Microsoft YaHei UI;\n  font-weight: 400;\n  cursor: pointer;\n}\n.btn .icon[data-v-9e2c85ea] {\n  width: 54px;\n  height: 54px;\n}\n.btn.disabled[data-v-9e2c85ea] {\n  color: #666;\n  cursor: not-allowed;\n}\n.btn.disabled .icon[data-v-9e2c85ea] {\n  opacity: 0.5;\n}\n.fontColor[data-v-9e2c85ea] {\n  color: var(--default-text-color);\n}";
 styleInject(css_248z$b);
 
 /* script */
@@ -2596,14 +2596,16 @@ var __vue_render__$a = function () {
               })
             : _vm._e(),
           _vm._v(" "),
-          _c("div", { staticClass: "btn", on: { click: _vm.refresh } }, [
-            _c("img", {
-              staticClass: "icon",
-              attrs: { src: _vm.refreshIcon, alt: "刷新" },
-            }),
-            _vm._v(" "),
-            _c("span", [_vm._v("刷新")]),
-          ]),
+          _vm.toolBarConfig.refreshBtnShow !== false
+            ? _c("div", { staticClass: "btn", on: { click: _vm.refresh } }, [
+                _c("img", {
+                  staticClass: "icon",
+                  attrs: { src: _vm.refreshIcon, alt: "刷新" },
+                }),
+                _vm._v(" "),
+                _c("span", [_vm._v("刷新")]),
+              ])
+            : _vm._e(),
           _vm._v(" "),
           _vm.toolBarConfig.exportBtnShow !== false
             ? _c(
@@ -3273,7 +3275,7 @@ __vue_render__$a._withStripped = true;
   /* style */
   const __vue_inject_styles__$a = undefined;
   /* scoped */
-  const __vue_scope_id__$a = "data-v-682ce335";
+  const __vue_scope_id__$a = "data-v-9e2c85ea";
   /* module identifier */
   const __vue_module_identifier__$a = undefined;
   /* functional template */
@@ -6985,10 +6987,10 @@ var script$2 = {
     window.addEventListener("keyup", this.handleKeyUp);
     window.addEventListener("mousemove", this.resize);
     window.addEventListener("mouseup", this.stopResize);
-    // 初始化tooltip显示隐藏
-    this.showTooltip = this.formCache.displayType == "float";
     // 初始化大小变化监听器
     this.initResizeObserver();
+    // 初始化tooltip显示隐藏
+    this.showTooltip = this.formCache.displayType == "float";
   },
   beforeDestroy() {
     window.removeEventListener("keydown", this.handleKeyDown);
@@ -7050,6 +7052,12 @@ var script$2 = {
       this.startIndex = targetIndex - Math.ceil(this.windowSize / 2);
       this.updateLanesChartOption("", "series");
     },
+    hiddenContextMenu() {
+      const ctxRef = this.$refs.vueSimpleContextMenu;
+      if (ctxRef) {
+        ctxRef.hideContextMenu();
+      }
+    },
     // 将当前页面px转换为cm
     pxToCm() {
       const container = this.$refs.targetDom;
@@ -7061,13 +7069,21 @@ var script$2 = {
       return cm;
     },
     getXAxisRangeByHeader(lineInfo, validData = []) {
-      const headerMin = Number(lineInfo && lineInfo.min);
-      const headerMax = Number(lineInfo && lineInfo.max);
-      const dataMin = Math.floor(Math.min(...validData));
-      const dataMax = Math.ceil(Math.max(...validData));
+      let headerMin = 0;
+      let headerMax = 1;
+      if(lineInfo && Object.prototype.hasOwnProperty.call(lineInfo, "min")){
+        headerMin = Number(lineInfo.min);
+      }else {
+        headerMin = Math.floor(Math.min(...validData));
+      }
+      if(lineInfo && Object.prototype.hasOwnProperty.call(lineInfo, "max")){
+        headerMax = Number(lineInfo.max);
+      }else {
+        headerMax = Math.ceil(Math.max(...validData));
+      }
 
-      const min = Number.isFinite(headerMin) ? headerMin : Number.isFinite(dataMin) ? dataMin : 0;
-      const max = Number.isFinite(headerMax) ? headerMax : Number.isFinite(dataMax) ? dataMax : 0;
+      const min = headerMin > 0 ? headerMin : 0;
+      const max = headerMax > 0 ? headerMax : 1;
       return { min, max };
     },
     // 通过 laneId 切换指定泳道 x 轴类型（value/log）
@@ -7387,7 +7403,7 @@ var script$2 = {
               const headerKey = entry.target.textContent || entry.target.innerText || "unknown";
               const currentWidth = entry.contentRect.width;
               const cachedWidth = this.headerWidthCache[headerKey];
-
+              // console.log("headerKey", headerKey, "currentWidth", currentWidth, "cachedWidth", cachedWidth);
               // 只有当宽度实际变化时才触发
               if (cachedWidth === undefined || Math.abs(currentWidth - cachedWidth) > 1) {
                 this.headerWidthCache[headerKey] = currentWidth;
@@ -7903,15 +7919,11 @@ var script$2 = {
         }
       }
     },
-    showContextMenu(event, item) {
+   showContextMenu(event, item) {
       event.stopPropagation();
+      this.$emit("showContextMenu", item);
       this.$refs.vueSimpleContextMenu.showMenu(event, item);
-    },
-    hiddenContextMenu() {
-      const ctxRef = this.$refs.vueSimpleContextMenu;
-      if (ctxRef) {
-        ctxRef.hideContextMenu();
-      }
+
     },
     optionClicked(event) {
       const { option, item } = event;
@@ -7981,8 +7993,25 @@ var script$2 = {
         this.laneWidthOverrides = {};
       }
       this.$emit("template-change", this.currentTemplate);
+      this.reobserveHeaders();
       this.updateLanesChartOption();
     },
+    getFirstDataIndexItem(seriesData) {
+      // 入参校验：确保是数组且非空
+      if (!Array.isArray(seriesData) || seriesData.length === 0) {
+        return null;
+      }
+
+      // 遍历数组，找到第一个包含 dataIndex 的项
+      for (const item of seriesData) {
+        if (typeof item.dataIndex !== "undefined" && item.dataIndex !== null) {
+          return item;
+        }
+      }
+
+      // 无匹配项返回 null
+      return null;
+    },
     getDefaultLaneChartOption() {
       const option = {
         backgroundColor: getCssVariable("--kd-lane-container-item-bg"),
@@ -8023,7 +8052,7 @@ var script$2 = {
         ],
         yAxis: [
           {
-            type: this.formCache.axisType == "time" ? "value" : "category",
+            type: "value",
             inverse: true,
             boundaryGap: false,
             scale: true,
@@ -8074,18 +8103,37 @@ var script$2 = {
               formatter: (params) => {
                 if (this.formCache.displayType == "header") {
                   let dataIndexItem = (params.seriesData && params.seriesData[0] && params.seriesData[0].dataIndex) || null;
+                  // let dataIndexItem = this.getFirstDataIndexItem(params.seriesData);
                   if (dataIndexItem !== null) {
                     this.headerData = this.visibleData[dataIndexItem];
+                    // this.headerData = this.visibleData[dataIndexItem.dataIndex];
                   } else {
                     this.headerData = {};
                   }
                 }
-                // 时间轴模式：格式化时间戳为可读时间
                 if (this.formCache.axisType == "time") {
-                  // 需要显示年月日时分秒
-                  return this.timestampToYMDHMS(params.value);
+                  return this.timestampToHms(params.value);
+                } else {
+                  return params.value.toString();
                 }
-                return params.value;
+                //     if (this.formCache.axisType == "time") {
+                //       // 时间轴模式：params.value 是时间戳
+                //       this.headerData =
+                //         this.visibleData.find(
+                //           (item) =>
+                //             this.toMillisecondTimestamp(item && item[this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]]) == params.value,
+                //         ) || {};
+                //     } else {
+                //       this.headerData =
+                //         this.visibleData.find((item) => item && item[this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]] == params.value) ||
+                //         {};
+                //     }
+                //   }
+                //   // 时间轴模式：格式化时间戳为可读时间
+                //   if (this.formCache.axisType == "time") {
+                //     return this.timestampToHms(params.value);
+                //   }
+                //   return params.value;
               },
             },
           },
@@ -8097,6 +8145,7 @@ var script$2 = {
             color: getCssVariable("---default-text-color"),
           },
           formatter: (series) => {
+            // 根据seriesName去重，保留数值最大的项，或者在有缺失值时保留缺失值的项
             const uniqueSeries = series
               .filter((item) => item.seriesName !== "helper")
               .reduce((acc, current) => {
@@ -8152,15 +8201,14 @@ var script$2 = {
             const outerDiv = document.createElement("div");
             uniqueSeries.forEach((params) => {
               const { seriesName, value, color } = params;
-              if (seriesName == "helper") return;
               const innerDiv = document.createElement("div");
               innerDiv.style = "display: flex; align-items: center;";
               const markerDiv = document.createElement("div");
               markerDiv.style = `height: 10px; width:10px;font-size:10px; border-radius:8px; gap: 5px; background-color:${color}`;
               const textSpan = document.createElement("span");
               let xValue = value;
-              // 时间轴模式：value 是 [x, y] 格式，取 x 值
-              if (this.formCache.axisType == "time" && Array.isArray(value)) {
+              // 时间轴和深度轴模式：value 是 [x, y] 格式，取 x 值
+              if (Array.isArray(value)) {
                 xValue = value[0];
               }
               if (xValue == undefined || xValue == null) {
@@ -8196,18 +8244,6 @@ var script$2 = {
 
       return `${h}:${m}:${s}`;
     },
-
-    timestampToYMDHMS(timestamp) {
-      const date = new Date(timestamp);
-      const h = String(date.getHours()).padStart(2, "0");
-      const m = String(date.getMinutes()).padStart(2, "0");
-      const s = String(date.getSeconds()).padStart(2, "0");
-      const y = date.getFullYear();
-      const month = String(date.getMonth() + 1).padStart(2, "0");
-      const day = String(date.getDate()).padStart(2, "0");
-      return `${y}-${month}-${day} ${h}:${m}:${s}`;
-    },
-
     toMillisecondTimestamp(time) {
       if (time === null || time === undefined) return Date.now();
       let timestamp = new Date(time).getTime();
@@ -8252,23 +8288,26 @@ var script$2 = {
 
       if (!lanes || lanes.length === 0) return;
 
-      // 深度轴数据
       let depthData = [];
-      // 时间轴数据
+      let timestamps = [];
+
       let yAxisMin = 0;
       let yAxisMax = 0;
 
+      // 获取当前轴类型的键
+      const axisKey =
+        (this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]) ||
+        (this.formCache.axisType === "time" ? "time" : "depth");
+
       if (this.formCache.axisType == "time") {
         // 时间轴模式：使用毫秒时间戳
-        const timestamps = realTimeData.map((item) =>
-          this.toMillisecondTimestamp(item[this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]]),
-        );
+        timestamps = realTimeData.map((item) => this.toMillisecondTimestamp(item[axisKey]));
         yAxisMin = Math.min(...timestamps);
         yAxisMax = Math.max(...timestamps);
       } else {
-        depthData = realTimeData.map(
-          (i) => +i[this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]],
-        );
+        depthData = realTimeData.map((i) => +i[axisKey]);
+        yAxisMin = Math.min(...depthData);
+        yAxisMax = Math.max(...depthData);
       }
 
       const paramNameMap = {};
@@ -8319,24 +8358,32 @@ var script$2 = {
               }
             }
           } else {
-            option.yAxis[0].data = depthData;
+            if (yAxisMin === yAxisMax) {
+              yAxisMin = yAxisMin - 1;
+              yAxisMax = yAxisMax + 1;
+            }
+            option.yAxis[0].min = yAxisMin;
+            option.yAxis[0].max = yAxisMax;
+            // 深度轴不需要 data 属性
+            delete option.yAxis[0].data;
 
             // 深度轴自适应间隔：根据数据量计算合适的间隔
-            const dataCount = depthData.length;
+            const depthRange = yAxisMax - yAxisMin;
+            const dataCount = realTimeData.length;
             if (dataCount > 0) {
               // 根据数据量设置合适的间隔
               if (dataCount < 10) {
-                // 数据量较少，显示所有标签
-                option.yAxis[0].interval = 0;
+                // 数据量较少，间隔可以小一些
+                option.yAxis[0].interval = depthRange / 5;
               } else if (dataCount < 50) {
                 // 数据量中等
-                option.yAxis[0].interval = Math.floor(dataCount / 10);
+                option.yAxis[0].interval = depthRange / 10;
               } else if (dataCount < 100) {
                 // 数据量较多
-                option.yAxis[0].interval = Math.floor(dataCount / 15);
+                option.yAxis[0].interval = depthRange / 15;
               } else {
                 // 数据量很多
-                option.yAxis[0].interval = Math.floor(dataCount / 20);
+                option.yAxis[0].interval = depthRange / 20;
               }
             }
           }
@@ -8403,9 +8450,13 @@ var script$2 = {
           lane &&
             lane.lines &&
             lane.lines.forEach((lineInfo, lineIndex) => {
-              // if (lineInfo.isUsed === "0") return;
               let seriesData = [];
               let validData = [];
+              // 获取当前轴类型的键
+              const axisKey =
+                (this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]) ||
+                (this.formCache.axisType === "time" ? "time" : "depth");
+
               if (this.formCache.axisType == "time") {
                 // 时间轴模式：数据格式为 [x, y]，其中 y 是时间戳
                 let currentParam = this.params.find((p) => p.paramId == lineInfo.paramId);
@@ -8425,7 +8476,7 @@ var script$2 = {
                     }
                   }
                   // 返回 [x, y] 格式，y 是时间戳
-                  return [value, this.toMillisecondTimestamp(item[this.toolBarConfig.axisTypeList[this.formCache.axisType]])];
+                  return [value, this.toMillisecondTimestamp(item[axisKey])];
                 });
                 validData = seriesData.filter((v) => Number.isFinite(+v[0]));
               } else {
@@ -8446,9 +8497,10 @@ var script$2 = {
                       });
                     }
                   }
-                  return value;
+                  // 返回 [x, y] 格式，y 是深度值
+                  return [value, +item[axisKey]];
                 });
-                validData = seriesData.filter((v) => Number.isFinite(+v));
+                validData = seriesData.filter((v) => Number.isFinite(+v[0]));
               }
               const { min, max } = this.getXAxisRangeByHeader(lineInfo, validData);
 
@@ -8489,9 +8541,9 @@ var script$2 = {
               baseSeries.markLine = {
                 symbol: "none",
                 lineStyle: {
-                  color: "red",
+                  color: getCssVariable("--default-text-color"),
                   type: "dashed",
-                  width: 2,
+                  width: 1,
                 },
                 label: {
                   show: false,
@@ -8501,13 +8553,13 @@ var script$2 = {
                 },
                 data: this.markLineData
                   .map((item, index) => {
-                    // 时间轴模式：将深度值转换为时间戳
+                    // 尝试精确匹配
                     const findItem = this.realTimeData.find((d) => d[this.toolBarConfig.axisTypeList[this.formCache.axisType]] == item);
                     if (findItem) {
                       if (this.formCache.axisType == "time") {
                         return { yAxis: this.toMillisecondTimestamp(findItem[this.toolBarConfig.axisTypeList[this.formCache.axisType]]) };
                       } else {
-                        return { yAxis: findItem[this.toolBarConfig.axisTypeList[this.formCache.axisType]] + "" };
+                        return { yAxis: Number(findItem[this.toolBarConfig.axisTypeList[this.formCache.axisType]]) };
                       }
                     } else {
                       // 精确匹配失败，找到最接近的深度值
@@ -8541,7 +8593,7 @@ var script$2 = {
               // ===== 面积图 =====
               if (lineInfo.lineType === "area") {
                 // 只对时间轴模式生效
-                if (this.formCache.axisType == "time" && seriesData.length > 0) {
+                if (seriesData.length > 0) {
                   // 找到第一个有效的数据点
                   const firstValidPoint = seriesData.find((point) => Number.isFinite(+point[0]));
                   if (firstValidPoint) {
@@ -8577,13 +8629,18 @@ var script$2 = {
 
               colors.push(color);
             });
+          // 获取当前轴类型的键
+          const axisKey =
+            (this.toolBarConfig.axisTypeList && this.toolBarConfig.axisTypeList[this.formCache.axisType]) ||
+            (this.formCache.axisType === "time" ? "time" : "depth");
+
           if (series.length > 0 && this.formCache.axisType == "depth") {
             let min = Math.max(...lane.lines.map((item) => this.getXAxisRangeByHeader(item).min));
-            // 兜底
+            // 兜底：深度轴模式使用 [x, y] 格式
             series.unshift({
               name: "helper",
               type: "line",
-              data: realTimeData.map(() => min),
+              data: realTimeData.map((item) => [min, +item[axisKey]]),
               lineStyle: {
                 opacity: 0,
               },
@@ -8596,10 +8653,7 @@ var script$2 = {
             series.unshift({
               name: "helper",
               type: "line",
-              data: realTimeData.map((item) => [
-                min,
-                this.toMillisecondTimestamp(item[this.toolBarConfig.axisTypeList[this.formCache.axisType]]),
-              ]),
+              data: realTimeData.map((item) => [min, this.toMillisecondTimestamp(item[axisKey])]),
               lineStyle: {
                 opacity: 0,
               },
@@ -8624,14 +8678,6 @@ var script$2 = {
       } catch (e) {
         console.error(e);
         this.clearEcharts();
-        this.realTimeDataLoading = false;
-      } finally {
-        // 延迟重置标记，给ECharts足够的时间完成渲染
-        setTimeout(() => {
-          this.isUpdatingChart = false;
-          // 图表更新后重新监听车道头部元素
-          this.reobserveHeaders();
-        }, 100);
       }
     },
     async clearEcharts() {
@@ -8756,44 +8802,15 @@ var script$2 = {
       const { sortOrder = "asc" } = options;
       const newDataArr = Array.isArray(newData) ? newData : [newData];
       let resultData = JSON.parse(JSON.stringify(existingData));
-
-      // 检查两个对象是否所有字段都相同
-      const isObjectsEqual = (obj1, obj2) => {
-        const keys1 = Object.keys(obj1);
-        const keys2 = Object.keys(obj2);
-
-        if (keys1.length !== keys2.length) {
-          return false;
-        }
-
-        for (const key of keys1) {
-          if (obj1[key] !== obj2[key]) {
-            return false;
-          }
-        }
-
-        return true;
-      };
-
       newDataArr.forEach((newItem) => {
         if (!newItem || !newItem[uniqueKey]) return;
-
-        // 首先根据 uniqueKey 查找匹配项
-        const itemsWithSameKey = resultData.filter((item) => item[uniqueKey] === newItem[uniqueKey]);
-
-        // 检查是否存在完全相同的项
-        const hasExactDuplicate = itemsWithSameKey.some((item) => isObjectsEqual(item, newItem));
-
-        if (hasExactDuplicate) {
-          // 如果存在完全相同的项，则不做操作
-          return;
+        const duplicateIndex = resultData.findIndex((item) => item[uniqueKey] === newItem[uniqueKey]);
+        if (duplicateIndex > -1) {
+          resultData[duplicateIndex] = newItem;
+        } else {
+          resultData.push(newItem);
         }
-
-        // 如果没有完全相同的项，则添加到结果中
-        resultData.push(newItem);
       });
-
-      // 去重后排序
       resultData.sort((a, b) => {
         const valA = a[uniqueKey];
         const valB = b[uniqueKey];
@@ -8807,8 +8824,7 @@ var script$2 = {
 
       return resultData;
     },
-
-    // 根据 uniqueKey 去重并排序（只考虑 uniqueKey）
+     // 根据 uniqueKey 去重并排序（只考虑 uniqueKey）
     deduplicateByUniqueKey(existingData, newData, uniqueKey, options = {}) {
       // 处理默认配置
       const { sortOrder = "asc" } = options;
@@ -9110,6 +9126,7 @@ var script$2 = {
       handler(newVal) {
         this.$nextTick(() => {
           this.markLineData = newVal;
+          this.updateLanesChartOption(null , 'series');
         });
       },
       deep: true,
@@ -9149,15 +9166,13 @@ var script$2 = {
         const firstValue = first && first[axisKey];
         const lastValue = last && last[axisKey];
 
-        const newParams = { firstValue, lastValue, settings: this.formCache };
+        const newParams = { firstValue, lastValue, settings: cloneDeep(this.formCache) };
 
         // 比较是否与上次触发时的参数相同
-        if (
-          this.lastVisibleDataChangeParams &&
-          this.lastVisibleDataChangeParams.firstValue === firstValue &&
-          this.lastVisibleDataChangeParams.lastValue === lastValue &&
-          JSON.stringify(this.lastVisibleDataChangeParams.settings) === JSON.stringify(newParams.settings)
-        ) {
+        if (this.lastVisibleDataChangeParams && 
+            this.lastVisibleDataChangeParams.firstValue === firstValue && 
+            this.lastVisibleDataChangeParams.lastValue === lastValue &&
+            JSON.stringify(this.lastVisibleDataChangeParams.settings) === JSON.stringify(newParams.settings)) {
           return;
         }
 
@@ -9226,7 +9241,7 @@ var script$2 = {
   },
 };
 
-var css_248z$3 = ".kd-lane-chart-container[data-v-27c6a5a2] {\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  position: relative;\n  border: 1px solid var(--kd-lane-container-border-color, #333);\n  display: flex;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container[data-v-27c6a5a2] {\n  height: 100%;\n  min-width: 0;\n  z-index: 1;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle[data-v-27c6a5a2] {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  width: 4px;\n  cursor: col-resize;\n  z-index: 10;\n  background-color: transparent;\n  transition: background-color 0.2s;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle[data-v-27c6a5a2]:hover,\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle[data-v-27c6a5a2]:hover {\n  background-color: var(--resizer-bg-color);\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle.kd-lane-resize-handle-left[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle.kd-lane-resize-handle-left[data-v-27c6a5a2] {\n  left: 0;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle.kd-lane-resize-handle-right[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle.kd-lane-resize-handle-right[data-v-27c6a5a2] {\n  right: -2px;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header[data-v-27c6a5a2] {\n  max-height: 40%;\n  overflow: hidden;\n  z-index: 2;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header .header-list-gap[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header .header-list-gap[data-v-27c6a5a2] {\n  display: flex;\n  overflow-x: hidden;\n  overflow-y: auto;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header .header-list-gap[data-v-27c6a5a2] ::-webkit-scrollbar,\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header .header-list-gap[data-v-27c6a5a2] ::-webkit-scrollbar {\n  display: none;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header .header-list-gap[data-v-27c6a5a2],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header .header-list-gap[data-v-27c6a5a2] {\n  flex-direction: column;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container-echart[data-v-27c6a5a2] {\n  flex: 1;\n  overflow-x: hidden;\n  overflow-y: auto;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container-echart .kd-lane-chart-lane-container-echart-content[data-v-27c6a5a2] {\n  height: 100%;\n  overflow: hidden;\n}\n.kd-lane-chart-container .border-left[data-v-27c6a5a2] {\n  border-left: 1px solid var(--kd-lane-container-border-color, #333);\n}\n.kd-lane-chart-container .border-bottom[data-v-27c6a5a2] {\n  border-bottom: 1px solid var(--kd-lane-container-border-color, #333);\n}\n.kd-lane-chart-container .border-right[data-v-27c6a5a2] {\n  border-right: 1px solid var(--kd-lane-container-border-color, #333);\n}\n.kd-lane-chart-container .kd-lane-chart-container-draw-area[data-v-27c6a5a2] {\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 3;\n  border: none;\n}";
+var css_248z$3 = ".kd-lane-chart-container[data-v-5a97fc52] {\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  position: relative;\n  border: 1px solid var(--kd-lane-container-border-color, #333);\n  display: flex;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container[data-v-5a97fc52] {\n  height: 100%;\n  min-width: 0;\n  z-index: 1;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle[data-v-5a97fc52] {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  width: 4px;\n  cursor: col-resize;\n  z-index: 10;\n  background-color: transparent;\n  transition: background-color 0.2s;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle[data-v-5a97fc52]:hover,\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle[data-v-5a97fc52]:hover {\n  background-color: var(--resizer-bg-color);\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle.kd-lane-resize-handle-left[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle.kd-lane-resize-handle-left[data-v-5a97fc52] {\n  left: 0;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-resize-handle.kd-lane-resize-handle-right[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-resize-handle.kd-lane-resize-handle-right[data-v-5a97fc52] {\n  right: -2px;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header[data-v-5a97fc52] {\n  max-height: 30%;\n  overflow: hidden;\n  z-index: 2;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header .header-list-gap[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header .header-list-gap[data-v-5a97fc52] {\n  display: flex;\n  overflow-x: hidden;\n  overflow-y: auto;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header .header-list-gap[data-v-5a97fc52] ::-webkit-scrollbar,\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header .header-list-gap[data-v-5a97fc52] ::-webkit-scrollbar {\n  display: none;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container .kd-lane-chart-lane-header .header-list-gap[data-v-5a97fc52],\n.kd-lane-chart-container .kd-lane-chart-lane-slot-container .kd-lane-chart-lane-header .header-list-gap[data-v-5a97fc52] {\n  flex-direction: column;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container-echart[data-v-5a97fc52] {\n  flex: 1;\n  overflow-x: hidden;\n  overflow-y: auto;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-lane-chart-container .kd-lane-chart-lane-container-echart .kd-lane-chart-lane-container-echart-content[data-v-5a97fc52] {\n  height: 100%;\n  overflow: hidden;\n}\n.kd-lane-chart-container .border-left[data-v-5a97fc52] {\n  border-left: 1px solid var(--kd-lane-container-border-color, #333);\n}\n.kd-lane-chart-container .border-bottom[data-v-5a97fc52] {\n  border-bottom: 1px solid var(--kd-lane-container-border-color, #333);\n}\n.kd-lane-chart-container .border-right[data-v-5a97fc52] {\n  border-right: 1px solid var(--kd-lane-container-border-color, #333);\n}\n.kd-lane-chart-container .kd-lane-chart-container-draw-area[data-v-5a97fc52] {\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 3;\n  border: none;\n}";
 styleInject(css_248z$3);
 
 /* script */
@@ -9291,8 +9306,7 @@ var __vue_render__$2 = function () {
                             _c(
                               "div",
                               {
-                                staticClass:
-                                  "kd-lane-chart-lane-header header-content-area",
+                                staticClass: "kd-lane-chart-lane-header",
                                 class: { "border-bottom": true },
                                 style: _vm.slotHeaderStyle,
                               },
@@ -9401,8 +9415,7 @@ var __vue_render__$2 = function () {
                                   _c(
                                     "draggable",
                                     {
-                                      staticClass:
-                                        "header-list-gap header-content-area",
+                                      staticClass: "header-list-gap",
                                       style: { gap: _vm.itemGap + "px" },
                                       attrs: {
                                         animation: 200,
@@ -9557,6 +9570,7 @@ var __vue_render__$2 = function () {
       _c(
         "el-dialog",
         {
+          staticClass: "function-control-panel-dialog",
           attrs: { title: "泳道模板设置", visible: _vm.curveConfigVisible },
           on: {
             "update:visible": function ($event) {
@@ -9595,7 +9609,7 @@ __vue_render__$2._withStripped = true;
   /* style */
   const __vue_inject_styles__$2 = undefined;
   /* scoped */
-  const __vue_scope_id__$2 = "data-v-27c6a5a2";
+  const __vue_scope_id__$2 = "data-v-5a97fc52";
   /* module identifier */
   const __vue_module_identifier__$2 = undefined;
   /* functional template */
@@ -9864,29 +9878,29 @@ var script = {
     };
   },
   created() {
-    this.depthTimeChartData = this.WellBitDepthTimePlotConfig && this.WellBitDepthTimePlotConfig.data || [];
+    this.depthTimeChartData = (this.WellBitDepthTimePlotConfig && this.WellBitDepthTimePlotConfig.data) || [];
     // 初始化数据
-    this.initialFormCache = cloneDeep(this.toolBarConfig && this.toolBarConfig.form || {});
-    this.formCache = cloneDeep(this.toolBarConfig && this.toolBarConfig.form || {});
+    this.initialFormCache = cloneDeep((this.toolBarConfig && this.toolBarConfig.form) || {});
+    this.formCache = cloneDeep((this.toolBarConfig && this.toolBarConfig.form) || {});
     // 初始化curveDatas副本
     this.cachedCurveDatas = cloneDeep(this.curveDatas || {});
     // 缓存初始化时的curveDatas
     this.initialCurveDatas = cloneDeep(this.curveDatas || {});
   },
   mounted() {
-    let form = cloneDeep(this.toolBarConfig && this.toolBarConfig.form || {});
+    let form = cloneDeep((this.toolBarConfig && this.toolBarConfig.form) || {});
     this.config = form.axisType === "depth" ? this.depthConfig : this.timeConfig;
     this.showChartContainer = true;
     // 初始化：获取容器宽度并转换百分比为像素
     this.$nextTick(() => {
-        this.containerWidth = this.$refs.container && this.$refs.container.offsetWidth || 800;
-        this.initWidth(); // 转换百分比为像素
-      });
+      this.containerWidth = (this.$refs.container && this.$refs.container.offsetWidth) || 800;
+      this.initWidth(); // 转换百分比为像素
+    });
 
     // 监听窗口大小变化，更新容器宽度
     window.addEventListener("resize", () => {
       this.$nextTick(() => {
-        this.containerWidth = this.$refs.container && this.$refs.container.offsetWidth || 800;
+        this.containerWidth = (this.$refs.container && this.$refs.container.offsetWidth) || 800;
       });
     });
   },
@@ -9900,11 +9914,15 @@ var script = {
     dialogFunction(data) {
       if (data.type === 1) {
         // 井深段
-        this.$refs.functionControlPanel.form.dataType = "history";
+        if (this.$refs.functionControlPanel) {
+          this.$refs.functionControlPanel.form.dataType = "history";
+        }
         this.formCache.dataType = "history";
       } else if (data.type === 2) {
         // 时间段
-        this.$refs.functionControlPanel.form.dataType = "history";
+        if (this.$refs.functionControlPanel) {
+          this.$refs.functionControlPanel.form.dataType = "history";
+        }
         this.formCache.dataType = "history";
       } else if (data.type === 3) ;
     },
@@ -9925,7 +9943,9 @@ var script = {
     },
     // 新增：跳转到下一个标记线
     jumpToNextMarkLine() {
-      this.$refs.chartContainer.jumpToNextMarkLine();
+      if (this.$refs.chartContainer) {
+        this.$refs.chartContainer.jumpToNextMarkLine();
+      }
     },
     // 新增：刷新数据，重置为初始化时的数据
     refresh() {
@@ -9965,7 +9985,9 @@ var script = {
     // 新增：更新scale缓存
     updateScale(newVal) {
       this.formCache.scale = newVal;
-      this.$refs.functionControlPanel.form.scale = newVal;
+      if (this.$refs.functionControlPanel) {
+        this.$refs.functionControlPanel.form.scale = newVal;
+      }
     },
     /**
      * 工具函数：百分比转像素
@@ -10040,7 +10062,7 @@ var script = {
       const dx = e.clientX - this.startX;
       const min = this.minWidth;
 
-      const containerWidth = this.$refs.container && this.$refs.container.offsetWidth - this.lineWidth || 0;
+      const containerWidth = (this.$refs.container && this.$refs.container.offsetWidth - this.lineWidth) || 0;
 
       // ✅ 拖拽第1条分隔线（panel1 和 panel2）
       if (this.currentResizer === 1) {
@@ -10130,7 +10152,9 @@ var script = {
             this.initWidth();
           }
           if (newVal.form !== oldVal.form) {
-            this.$refs.functionControlPanel.updateForm(newVal.form);
+            if (this.$refs.functionControlPanel) {
+              this.$refs.functionControlPanel.updateForm(newVal.form);
+            }
           }
         }
       },
@@ -10154,29 +10178,37 @@ var script = {
           if (JSON.stringify(this.initialCurveDatas) === "{}") {
             this.initialCurveDatas = cloneDeep(newVal || {});
           }
-          if (Object.prototype.hasOwnProperty.call(newVal, "dataType")) {
+          if (
+            Object.prototype.hasOwnProperty.call(newVal, "dataType") &&
+            newVal.dataType !== this.formCache.dataType &&
+            newVal.dataType !== "" &&
+            newVal.dataType !== undefined &&
+            newVal.dataType !== null
+          ) {
             this.formCache.dataType = newVal.dataType;
-            this.$refs.functionControlPanel.form.dataType = newVal.dataType;
+            if (this.$refs.functionControlPanel) {
+              this.$refs.functionControlPanel.form.dataType = newVal.dataType;
+            }
           }
           this.cachedCurveDatas = cloneDeep(newVal || {});
         }
       },
       deep: true,
     },
-    themeName:{
-      handler(newVal){
+    themeName: {
+      handler(newVal) {
         document.body.setAttribute("data-theme", newVal);
       },
-      deep:true,
-      immediate:true
-    }
+      deep: true,
+      immediate: true,
+    },
   },
 };
 
 var css_248z$1 = "@charset \"UTF-8\";\n[data-theme=dark] {\n  --bg-color: #1e1e1e;\n  --card-color: #252526;\n  --card-border-color: #4b4b4b;\n  --card-label-color: #d6d6d6;\n  --card-value-color: #ffffff;\n  --panel-item-bg-color: #1e1e1e;\n  --resizer-bg-color: rgb(177, 177, 177, 0.4);\n  --panel-item-border-color: #4b4b4b;\n  --default-text-color: #ffffff;\n  --radio-border-color: #4b4b4b;\n  --radio-checked-border-color: #f86c59;\n  --radio-checked-color: #f86c59;\n  --radio-checked-text-color: #ffffff;\n  --radio-checked-border-color: #f86c59;\n  --split-line-color: #4b4b4b;\n  /* 边框颜色 */\n  --border-color: #4b4b4b;\n  --label-float-bg-color: rgba(255, 255, 255, 0.1);\n  --slider-gradient-start: #333333;\n  --slider-gradient-end: #656668;\n  --slider-gradient-color: linear-gradient(0deg, #333333 0%, #656668 100%);\n  --slider-content-color: #f86c59;\n  --tooltip-bg-color: rgb(51, 51, 51,0.8);\n  --kd-lane-container-border-color: #4b4b4b;\n  --kd-lane-container-header-item-color: #ffffff;\n  --kd-lane-container-header-item-warning-color: rgba(248, 108, 89, 0.6);\n  --kd-lane-container-header-bg: #333333;\n  --kd-lane-container-item-bg: #252526;\n  --kd-lane-container-item-line-color: #4b4b4b66;\n  --select-hover-bg-color: #333333;\n  --select-selected-text-color: #ffcc33;\n  --dialog-header: #333333;\n  --dialog-button-default: #252526;\n  --dialog-button-disabled-text: #ffffff;\n  --in-range-text-color: #ffffff;\n  --dialog-tree-text-color: #ffffff;\n}\n[data-theme=white] {\n  --bg-color: #ffffff;\n  --card-color: #ffffff;\n  --card-border-color: #C9C9C9;\n  --card-label-color: #666666;\n  --card-value-color: #333333;\n  --panel-item-bg-color: #ffffff;\n  --resizer-bg-color: rgb(177, 177, 177,.4);\n  --panel-item-border-color: #C9C9C9;\n  --default-text-color: #333333;\n  --radio-border-color: #C9C9C9;\n  --radio-checked-border-color: #EC4521;\n  --radio-checked-color: #EC4521;\n  --radio-checked-text-color: #000000;\n  --radio-checked-border-color: #EC4521;\n  --split-line-color: #C9C9C9;\n  /* 边框颜色 */\n  --border-color: #C9C9C9;\n  --label-float-bg-color: rgba(27, 79, 217, 0.1);\n  --slider-gradient-start: #B0C2F5;\n  --slider-gradient-end: #DBE5FF;\n  --slider-gradient-color: linear-gradient(0deg, #B0C2F5 0%, #DBE5FF 100%);\n  --slider-content-color: #EC4521;\n  --tooltip-bg-color: rgba(246, 247, 248, 0.8);\n  --kd-lane-container-border-color: #C9C9C9;\n  --kd-lane-container-header-item-color: #333333;\n  --kd-lane-container-header-item-warning-color: rgba(200, 23, 29, 0.6);\n  --kd-lane-container-header-bg: #ecf4ff;\n  --kd-lane-container-item-bg: #eff3ff;\n  --kd-lane-container-item-line-color: #dddddd;\n  --select-hover-bg-color: #E0E9FE;\n  --select-selected-text-color: #1B4FD9;\n  --dialog-header:#1B4FD9;\n  --dialog-header-text-color: #ffffff;\n  --dialog-button-default:#ffffff;\n  --dialog-button-disabled-text: #FFFFFF;\n  --in-range-text-color: #ffffff;\n  --dialog-tree-text-color: #ffffff;\n}\n[data-theme=gray] {\n  --bg-color: #ffffff;\n  --card-color: #f6f7f8;\n  --card-border-color: #b1b1b1;\n  --card-label-color: #666666;\n  --card-value-color: #333333;\n  --panel-item-bg-color: #ffffff;\n  --resizer-bg-color: rgb(177, 177, 177,.4);\n  --panel-item-border-color: #b1b1b1;\n  --default-text-color: #333333;\n  --radio-border-color: #b1b1b1;\n  --radio-checked-border-color: #f86c59;\n  --radio-checked-color: #f86c59;\n  --radio-checked-text-color: #000000;\n  --radio-checked-border-color: #f86c59;\n  --split-line-color: #b1b1b1;\n  /* 边框颜色 */\n  --border-color: #b1b1b1;\n  --label-float-bg-color: rgba(128, 128, 128, 0.1);\n  --slider-gradient-start: #a6a6a6;\n  --slider-gradient-end: #dfdfdf;\n  --slider-gradient-color: linear-gradient(0deg, #a6a6a6 0%, #dfdfdf 100%);\n  --slider-content-color: #f86c59;\n  --tooltip-bg-color: rgba(246, 247, 248, 0.8);\n  --kd-lane-container-border-color: #b1b1b1;\n  --kd-lane-container-header-item-color: #333333;\n  --kd-lane-container-header-item-warning-color: rgba(177, 42, 39,0.6);\n  --kd-lane-container-header-bg: #eeeeee;\n  --kd-lane-container-item-bg: #f6f7f8;\n  --kd-lane-container-item-line-color: #dddddd;\n  --select-hover-bg-color: #dfdfdf;\n  --select-selected-text-color: #ffcc33;\n  --dialog-header:#EBEBEB;\n  --dialog-button-default:#f6f7f8;\n  --dialog-button-disabled-text: #ffffff;\n  --in-range-text-color: #333333;\n  --dialog-tree-text-color: #333333;\n}\n\n/* 下拉框 */\n.kd-curve-2d-select-popup {\n  background: var(--bg-color) !important;\n  border: 1px solid var(--border-color) !important;\n  /* 列表容器（关键） */\n}\n.kd-curve-2d-select-popup .el-scrollbar__wrap {\n  margin-bottom: 0 !important;\n  margin-right: 0 !important;\n  background: var(--bg-color) !important;\n  /* 隐藏滚动条 */\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-curve-2d-select-popup .el-scrollbar__wrap::-webkit-scrollbar {\n  display: none;\n}\n.kd-curve-2d-select-popup {\n  /* 每一项（默认） */\n}\n.kd-curve-2d-select-popup .el-select-dropdown__item {\n  background: var(--bg-color) !important;\n  color: var(--default-text-color) !important;\n  /* hover */\n}\n.kd-curve-2d-select-popup .el-select-dropdown__item.hover, .kd-curve-2d-select-popup .el-select-dropdown__item:hover {\n  background: var(--select-hover-bg-color) !important;\n  color: var(--default-text-color) !important;\n}\n.kd-curve-2d-select-popup .el-select-dropdown__item.selected {\n  background: var(--bg-color) !important; /* 不要灰色 */\n  color: var(--select-selected-text-color) !important; /* 高亮文字（可选） */\n  font-weight: bold;\n}\n.kd-curve-2d-select-popup .el-select-dropdown__item.selected.hover, .kd-curve-2d-select-popup .el-select-dropdown__item.selected:hover {\n  background: var(--select-hover-bg-color) !important;\n}\n.kd-curve-2d-select-popup {\n  /* 三角箭头 */\n}\n.kd-curve-2d-select-popup[x-placement^=bottom] .popper__arrow {\n  border-bottom-color: var(--border-color) !important;\n}\n.kd-curve-2d-select-popup[x-placement^=bottom] .popper__arrow::after {\n  border-bottom-color: var(--bg-color) !important;\n}\n.kd-curve-2d-select-popup[x-placement^=top] .popper__arrow {\n  border-top-color: var(--border-color) !important;\n}\n.kd-curve-2d-select-popup[x-placement^=top] .popper__arrow::after {\n  border-top-color: var(--bg-color) !important;\n}\n.kd-curve-2d-select-popup .el-time-panel {\n  background: var(--bg-color) !important;\n  box-shadow: 0 2px 12px 0 transparent;\n  border: 1px solid var(--border-color);\n}\n.kd-curve-2d-select-popup .el-time-panel .el-time-panel__btn {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-time-panel .el-time-spinner__item {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-time-panel .el-time-spinner__item.active:not(.disabled) {\n  color: var(--select-selected-text-color);\n  font-weight: bold;\n}\n.kd-curve-2d-select-popup .el-time-panel .el-time-panel__footer {\n  border-top: 1px solid var(--border-color);\n}\n.kd-curve-2d-select-popup .el-time-panel .el-time-spinner__item:hover:not(.disabled):not(.active) {\n  background: var(--select-hover-bg-color);\n}\n.kd-curve-2d-select-popup .el-color-picker__trigger {\n  border: 1px solid var(--dialog-header);\n}\n.kd-curve-2d-select-popup .el-color-picker__panel {\n  background: var(--bg-color) !important;\n  border: 1px solid var(--dialog-header);\n  border-radius: 0px;\n}\n.kd-curve-2d-select-popup .el-color-picker__panel .el-button--text {\n  color: var(--select-selected-text-color);\n}\n.kd-curve-2d-select-popup .el-color-picker__panel .el-button--default {\n  background: var(--dialog-button-default);\n  color: var(--default-text-color);\n  border: none;\n  border-radius: 0px;\n}\n.kd-curve-2d-select-popup .el-color-picker__panel .el-button.is-plain:hover {\n  background: var(--dialog-button-default);\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper {\n  background: var(--bg-color);\n  border: 1px solid var(--dialog-header);\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-input__inner {\n  background: var(--bg-color) !important;\n  border: 1px solid var(--border-color) !important;\n  color: var(--text-color) !important;\n  height: 32px !important;\n  line-height: 32px !important;\n  box-sizing: border-box;\n  border-radius: 0px;\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-picker__header-label {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-picker__header-label:hover {\n  color: var(--select-selected-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-range-picker__time-header > .el-icon-arrow-right {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-button--text {\n  color: var(--select-selected-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-picker-panel__icon-btn {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-range-picker__time-header {\n  border-bottom: 1px solid var(--dialog-header);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-range-picker__content.is-left {\n  border-right: 1px solid var(--dialog-header);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table th {\n  border-bottom: 1px solid var(--dialog-header);\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.today span {\n  color: var(--select-selected-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.available:hover {\n  color: var(--select-selected-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.next-month,\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.prev-month {\n  color: var(--dialog-header);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.available {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.available.in-range {\n  color: var(--in-range-text-color) !important;\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.end-date span,\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.start-date span {\n  background: var(--select-selected-text-color);\n}\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.in-range div,\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table td.in-range div:hover,\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table.is-week-mode .el-date-table__row.current div,\n.kd-curve-2d-select-popup .el-picker-panel__body-wrapper .el-date-table.is-week-mode .el-date-table__row:hover div {\n  background: var(--dialog-header);\n}\n.kd-curve-2d-select-popup .el-picker-panel__footer {\n  background: var(--bg-color);\n  border-top: 1px solid var(--dialog-header);\n}\n.kd-curve-2d-select-popup .el-picker-panel__footer .el-button--default {\n  background: var(--dialog-button-default);\n  color: var(--default-text-color);\n  border: none;\n  border-radius: 0px;\n}\n.kd-curve-2d-select-popup .el-picker-panel__footer .el-button.is-disabled.is-plain,\n.kd-curve-2d-select-popup .el-picker-panel__footer .el-button.is-disabled.is-plain:focus,\n.kd-curve-2d-select-popup .el-picker-panel__footer .el-button.is-disabled.is-plain:hover {\n  background: var(--dialog-button-default);\n  color: var(--dialog-button-disabled-text);\n}\n.kd-curve-2d-select-popup .el-picker-panel__footer .el-button.is-disabled.is-plain {\n  background: var(--dialog-button-default);\n  color: var(--dialog-button-disabled-text) !important;\n}\n.kd-curve-2d-select-popup .el-popper[x-placement^=bottom] .popper__arrow::after {\n  border-bottom-color: var(--bg-color) !important;\n}\n.kd-curve-2d-container {\n  /* radio 自定义样式 */\n}\n.kd-curve-2d-container .el-radio {\n  display: flex;\n  align-items: center;\n  vertical-align: middle;\n  color: var(--radio-default-text-color);\n  font-family: Microsoft YaHei UI, Microsoft YaHei UI;\n  font-size: 14px;\n}\n.kd-curve-2d-container .el-radio__inner {\n  width: 14px;\n  height: 14px;\n  background: transparent;\n  border: 1px solid var(--radio-border-color);\n}\n.kd-curve-2d-container .el-radio__input.is-checked .el-radio__inner {\n  border-color: var(--radio-checked-border-color);\n  background: transparent;\n}\n.kd-curve-2d-container .el-radio__input.is-disabled .el-radio__inner {\n  background-color: transparent;\n  border-color: var(--radio-border-color);\n}\n.kd-curve-2d-container .el-radio__inner::after {\n  width: 7px;\n  height: 7px;\n  background: var(--radio-checked-color);\n}\n.kd-curve-2d-container .el-radio.is-checked .el-radio__label {\n  color: var(--radio-checked-text-color);\n  font-weight: bold;\n}\n.kd-curve-2d-container {\n  /* select */\n}\n.kd-curve-2d-container .el-input__inner {\n  background: var(--bg-color) !important;\n  border: 1px solid var(--border-color) !important;\n  color: var(--text-color) !important;\n  height: 32px !important;\n  line-height: 32px !important;\n  box-sizing: border-box;\n  border-radius: 0px;\n}\n.kd-curve-2d-container {\n  /* 下拉箭头 */\n}\n.kd-curve-2d-container .el-select .el-input__suffix i {\n  display: none !important;\n}\n.kd-curve-2d-container .el-select .el-input__suffix {\n  right: 0;\n  width: 28px;\n  height: 32px !important;\n  line-height: 32px !important;\n  background: var(--slider-gradient-color);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-left: 1px solid var(--border-color);\n}\n.kd-curve-2d-container .el-select .el-input__suffix::after {\n  content: \"\";\n  width: 0;\n  height: 0;\n  border-left: 5px solid transparent;\n  border-right: 5px solid transparent;\n  border-top: 6px solid var(--slider-content-color); /* 橙色三角 */\n}\n.kd-curve-2d-container .el-select .el-input__suffix::after {\n  transition: transform 0.2s ease;\n}\n.kd-curve-2d-container .el-select .el-input.is-focus .el-input__suffix::after {\n  transform: rotate(180deg);\n}\n.kd-curve-2d-container .el-dialog {\n  border: 1px solid var(--card-border-color);\n}\n.kd-curve-2d-container .el-dialog .el-form-item__label {\n  color: var(--default-text-color);\n  font-size: 14px;\n}\n.kd-curve-2d-container .el-dialog .el-dialog__headerbtn {\n  top: 11px;\n  width: 24px;\n  height: 24px;\n  background: linear-gradient(270deg, #c73521 0%, #f86c59 100%);\n  border-radius: 100px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.kd-curve-2d-container .el-dialog .el-dialog__headerbtn .el-dialog__close {\n  color: #fff;\n  font-size: 14px;\n  font-weight: 700;\n}\n.kd-curve-2d-container .el-button {\n  border-radius: 0px;\n  border: none;\n}\n.kd-curve-2d-container .el-button--primary {\n  background-image: linear-gradient(to bottom, #2057ea, #12338d);\n}\n.kd-curve-2d-container .el-button--default {\n  background: var(--dialog-button-default);\n  color: var(--default-text-color);\n}\n.kd-curve-2d-container .el-button--primary.is-disabled {\n  background-image: linear-gradient(to bottom, #2f5ede, #1e3677);\n  color: var(--dialog-button-disabled-text);\n}\n.kd-curve-2d-container .el-tabs .el-tabs__nav-wrap::after {\n  background-color: var(--card-border-color);\n}\n.kd-curve-2d-container .el-tabs .el-tabs__item {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-container .el-tabs .el-tabs__item.is-active {\n  color: var(--select-selected-text-color);\n}\n.kd-curve-2d-container .el-tabs .el-tabs__active-bar {\n  background: var(--select-selected-text-color);\n}\n.kd-curve-2d-container .el-tree {\n  background: var(--bg-color) !important;\n  color: var(--default-text-color);\n  font-size: 14px;\n}\n.kd-curve-2d-container .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {\n  background: var(--dialog-header) !important;\n  color: var(--dialog-tree-text-color);\n}\n.kd-curve-2d-container .el-tree-node__content:hover,\n.kd-curve-2d-container .el-upload-list__item:hover {\n  background: var(--dialog-header) !important;\n  color: var(--dialog-tree-text-color);\n}\n.kd-curve-2d-container .vue-simple-context-menu__item,\n.kd-curve-2d-container .vue-simple-context-menu__item {\n  font-size: 14px !important;\n}\n.kd-curve-2d-container .kd-lane-el-container {\n  border: 1px solid var(--card-border-color);\n}\n.kd-curve-2d-container .kd-lane-el-container .rtd-config-side {\n  border-right: 1px solid var(--card-border-color);\n}\n.kd-curve-2d-container .el-dialog__header {\n  background: var(--dialog-header);\n  text-align: center;\n}\n.kd-curve-2d-container .el-dialog__header .el-dialog__title {\n  color: var(--dialog-header-text-color);\n}\n.kd-curve-2d-container .el-dialog__header {\n  padding: 10px 10px 10px;\n}\n.kd-curve-2d-container .el-dialog__body {\n  background: var(--bg-color);\n  padding: 30px 30px 10px 30px;\n}\n.kd-curve-2d-container .el-dialog__body .input-number-container .el-input__inner {\n  width: calc(100% - 80px) !important;\n  margin-left: 40px !important;\n}\n.kd-curve-2d-container .el-dialog__body .el-input__inner {\n  color: var(--default-text-color) !important;\n}\n.kd-curve-2d-container .el-dialog__body .el-input-number__decrease,\n.kd-curve-2d-container .el-dialog__body .el-input-number__increase {\n  color: var(--default-text-color);\n}\n.kd-curve-2d-container .el-dialog__body .el-input-number__increase {\n  background: var(--card-color);\n  color: var(--default-text-color);\n  border-radius: 0px 0px 0px 0px;\n  border: 1px solid var(--card-border-color);\n  width: 30px;\n  height: 30px;\n  line-height: 30px;\n}\n.kd-curve-2d-container .el-dialog__body .el-input-number__decrease {\n  background: var(--card-color);\n  border-radius: 0px 0px 0px 0px;\n  border: 1px solid var(--card-border-color);\n  width: 30px;\n  height: 30px;\n  line-height: 30px;\n}\n.kd-curve-2d-container .el-dialog__footer {\n  text-align: center;\n  background: var(--bg-color);\n}\n.kd-curve-2d-container .el-date-editor {\n  background: var(--bg-color) !important;\n}\n.kd-curve-2d-container .el-date-editor .el-range-input {\n  background: var(--bg-color) !important;\n  border-top: 1px solid var(--border-color) !important;\n  border-bottom: 1px solid var(--border-color) !important;\n  color: var(--text-color) !important;\n  height: 32px !important;\n  line-height: 32px !important;\n  box-sizing: border-box;\n  border-radius: 0px;\n}\n.kd-curve-2d-container .el-date-editor .el-range-separator {\n  color: var(--default-text-color);\n}";
 styleInject(css_248z$1);
 
-var css_248z = "@charset \"UTF-8\";\n.kd-curve-2d-resize-container[data-v-18d00693] {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: var(--bg-color);\n  color: var(--default-text-color);\n  overflow: hidden;\n  /* 主容器 */\n}\n.kd-curve-2d-resize-container .container[data-v-18d00693] {\n  display: flex;\n  flex: 1;\n  width: 100%;\n  overflow: hidden;\n}\n.kd-curve-2d-resize-container[data-v-18d00693] {\n  /* 面板通用样式 */\n}\n.kd-curve-2d-resize-container .panel[data-v-18d00693] {\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  flex-shrink: 0;\n  background: var(--panel-item-bg-color);\n  border: 1px solid var(--panel-item-border-color);\n  padding: 8px;\n  /* 隐藏滚动条 */\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-curve-2d-resize-container .panel[data-v-18d00693]::-webkit-scrollbar {\n  display: none;\n}\n.kd-curve-2d-resize-container .panel-3[data-v-18d00693] {\n  flex: 1;\n  min-width: 100px;\n}\n.kd-curve-2d-resize-container[data-v-18d00693] {\n  /* 拖拽条样式 */\n}\n.kd-curve-2d-resize-container .resizer[data-v-18d00693] {\n  width: 6px;\n  cursor: col-resize;\n}\n.kd-curve-2d-resize-container .resizer[data-v-18d00693]:hover {\n  background-color: var(--resizer-bg-color);\n  transition: background-color 0.2s ease;\n}";
+var css_248z = "@charset \"UTF-8\";\n.kd-curve-2d-resize-container[data-v-815b84b2] {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: var(--bg-color);\n  color: var(--default-text-color);\n  overflow: hidden;\n  /* 主容器 */\n}\n.kd-curve-2d-resize-container .container[data-v-815b84b2] {\n  display: flex;\n  flex: 1;\n  width: 100%;\n  overflow: hidden;\n}\n.kd-curve-2d-resize-container[data-v-815b84b2] {\n  /* 面板通用样式 */\n}\n.kd-curve-2d-resize-container .panel[data-v-815b84b2] {\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  flex-shrink: 0;\n  background: var(--panel-item-bg-color);\n  border: 1px solid var(--panel-item-border-color);\n  padding: 8px;\n  /* 隐藏滚动条 */\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.kd-curve-2d-resize-container .panel[data-v-815b84b2]::-webkit-scrollbar {\n  display: none;\n}\n.kd-curve-2d-resize-container .panel-3[data-v-815b84b2] {\n  flex: 1;\n  min-width: 100px;\n}\n.kd-curve-2d-resize-container[data-v-815b84b2] {\n  /* 拖拽条样式 */\n}\n.kd-curve-2d-resize-container .resizer[data-v-815b84b2] {\n  width: 6px;\n  cursor: col-resize;\n}\n.kd-curve-2d-resize-container .resizer[data-v-815b84b2]:hover {\n  background-color: var(--resizer-bg-color);\n  transition: background-color 0.2s ease;\n}";
 styleInject(css_248z);
 
 /* script */
@@ -10374,7 +10406,7 @@ __vue_render__._withStripped = true;
   /* style */
   const __vue_inject_styles__ = undefined;
   /* scoped */
-  const __vue_scope_id__ = "data-v-18d00693";
+  const __vue_scope_id__ = "data-v-815b84b2";
   /* module identifier */
   const __vue_module_identifier__ = undefined;
   /* functional template */