更新图层控制逻辑

src/app/OlMap/Controls/StyleEditorPanel.tsx

@@ -31,7 +31,7 @@ import { parseColor } from "@utils/parseColor";
 import { VectorTile } from "ol";
 import { useNotification } from "@refinedev/core";
 import { config } from "@/config/config";
-import { DeckLayer } from "@utils/layers";
+import { set } from "ol/transform";
 
 interface StyleConfig {
   property: string;
@@ -190,9 +190,11 @@ const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
     pipeText,
     setShowJunctionTextLayer,
     setShowPipeTextLayer,
-    setShowContourLayer,
+    setContourLayerAvailable,
+    setWaterflowLayerAvailable,
     setJunctionText,
     setPipeText,
+    deckLayer,
   } = data;
 
   const { open } = useNotification();
@@ -358,6 +360,7 @@ const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
           setJunctionText(property);
           setShowJunctionTextLayer(styleConfig.showLabels);
           setApplyJunctionStyle(true);
+          setContourLayerAvailable && setContourLayerAvailable(true);
           saveLayerStyle(layerId);
           open?.({
             type: "success",
@@ -370,6 +373,7 @@ const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
           setPipeText(property);
           setShowPipeTextLayer(styleConfig.showLabels);
           setApplyPipeStyle(true);
+          setWaterflowLayerAvailable && setWaterflowLayerAvailable(true);
           saveLayerStyle(layerId);
           open?.({
             type: "success",
@@ -443,7 +447,6 @@ const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
       }
       if (junctionStyleConfigState)
         applyLayerStyle(junctionStyleConfigState, breaks);
-      updateContourLayerStyle(breaks, junctionStyleConfigState?.styleConfig);
     } else if (
       layerType === "pipes" &&
       currentPipeCalData &&
@@ -677,10 +680,12 @@ const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
         setApplyJunctionStyle(false);
         if (setShowJunctionTextLayer) setShowJunctionTextLayer(false);
         if (setJunctionText) setJunctionText("");
+        setContourLayerAvailable && setContourLayerAvailable(false);
       } else if (layerId === "pipes") {
         setApplyPipeStyle(false);
         if (setShowPipeTextLayer) setShowPipeTextLayer(false);
         if (setPipeText) setPipeText("");
+        setWaterflowLayerAvailable && setWaterflowLayerAvailable(false);
       }
     }
   }, [selectedRenderLayer]);
@@ -1427,110 +1432,6 @@ const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
       );
     }
   };
-  // 更新 ContourLayer 的样式，并显示在地图上
-  const updateContourLayerStyle = (breaks: any, styleConfig: any) => {
-    if (!map) return;
-    // 查找包含 contourLayer 的 DeckLayer
-    const deckLayerWrapper = map
-      .getLayers()
-      .getArray()
-      .find((layer) => {
-        if (layer instanceof DeckLayer) {
-          const deckLayers = layer.getDeckLayers();
-          // 检查是否包含 contourLayer
-          return deckLayers.some((dl: any) => dl.id === "contourLayer");
-        }
-        return false;
-      }) as DeckLayer | undefined;
-
-    if (!deckLayerWrapper) return;
-
-    // 计算颜色
-    const segmentCount = breaks.length - 1;
-    if (segmentCount <= 0) return;
-
-    const thresholdColor = () => {
-      let colors: string[] = [];
-      if (styleConfig.colorType === "single") {
-        const c = SINGLE_COLOR_PALETTES[styleConfig.singlePaletteIndex].color;
-        colors = Array(segmentCount).fill(c);
-      } else if (styleConfig.colorType === "gradient") {
-        const { start, end } =
-          GRADIENT_PALETTES[styleConfig.gradientPaletteIndex];
-        const startColor = parseColor(start);
-        const endColor = parseColor(end);
-        for (let i = 0; i < segmentCount; i++) {
-          const ratio = segmentCount > 1 ? i / (segmentCount - 1) : 1;
-          const r = Math.round(
-            startColor.r + (endColor.r - startColor.r) * ratio
-          );
-          const g = Math.round(
-            startColor.g + (endColor.g - startColor.g) * ratio
-          );
-          const b = Math.round(
-            startColor.b + (endColor.b - startColor.b) * ratio
-          );
-          colors.push(`rgba(${r}, ${g}, ${b}, 1)`);
-        }
-      } else if (styleConfig.colorType === "rainbow") {
-        const baseColors =
-          RAINBOW_PALETTES[styleConfig.rainbowPaletteIndex].colors;
-        colors = Array.from(
-          { length: segmentCount },
-          (_, i) => baseColors[i % baseColors.length]
-        );
-      } else if (styleConfig.colorType === "custom") {
-        const custom = styleConfig.customColors || [];
-        const result = [...custom];
-        const reverseRainbowColors = RAINBOW_PALETTES[1].colors;
-        while (result.length < segmentCount) {
-          result.push(
-            reverseRainbowColors[
-              (result.length - custom.length) % reverseRainbowColors.length
-            ]
-          );
-        }
-        colors = result.slice(0, segmentCount);
-      }
-      return colors;
-    };
-
-    const colors = thresholdColor();
-    // 构建 contours 配置
-    const contours: any[] = [];
-    for (let i = 0; i < segmentCount; i++) {
-      const start = breaks[i];
-      const end = breaks[i + 1];
-      const colorStr = colors[i];
-      try {
-        const c = parseColor(colorStr);
-        contours.push({
-          threshold: [start, end],
-          color: [c.r, c.g, c.b],
-        });
-      } catch (e) {
-        console.warn("Color parse error", colorStr);
-      }
-    }
-    // 更新 DeckLayer
-    const deck = (deckLayerWrapper as any).deck;
-    if (deck && deck.props && deck.props.layers) {
-      const currentLayers = deck.props.layers;
-      const newLayers = currentLayers.map((layer: any) => {
-        if (layer.id === "contourLayer") {
-          return layer.clone({
-            contours: contours,
-          });
-        }
-        return layer;
-      });
-      console.log(newLayers);
-      deck.setProps({ layers: newLayers });
-    }
-
-    // 显示 contourLayer
-    // if (setShowContourLayer) setShowContourLayer(true);
-  };
 
   return (
     <>