新增水质分析功能模块

src/app/OlMap/Controls/LayerControl.tsx

@@ -28,10 +28,21 @@ const LayerControl: React.FC = () => {
   } = data;
   const [layerItems, setLayerItems] = useState<LayerItem[]>([]);
 
+  const layerOrder = [
+    "junctions",
+    "reservoirs",
+    "tanks",
+    "pipes",
+    "pumps",
+    "valves",
+    "scada",
+    "waterflowLayer",
+    "junctionContourLayer",
+  ];
+
   // 更新图层列表
   const updateLayers = useCallback(() => {
     if (!map || !data) return;
-    const { deckLayer } = data;
 
     const items: LayerItem[] = [];
 
@@ -93,19 +104,6 @@ const LayerControl: React.FC = () => {
       });
     }
 
-    // 3. 定义图层显示顺序和过滤白名单
-    const layerOrder = [
-      "junctions",
-      "reservoirs",
-      "tanks",
-      "pipes",
-      "pumps",
-      "valves",
-      "scada",
-      "waterflowLayer",
-      "junctionContourLayer",
-    ];
-
     // 过滤并排序
     const sortedItems = items
       .filter((item) => layerOrder.includes(item.id))
@@ -116,7 +114,7 @@ const LayerControl: React.FC = () => {
       });
 
     setLayerItems(sortedItems);
-  }, [map, isWaterflowLayerAvailable, isContourLayerAvailable]);
+  }, [map, deckLayer, isWaterflowLayerAvailable, isContourLayerAvailable]);
 
   useEffect(() => {
     updateLayers();
@@ -146,7 +144,7 @@ const LayerControl: React.FC = () => {
     }
 
     setLayerItems((prev) =>
-      prev.map((i) => (i.id === item.id ? { ...i, visible: checked } : i))
+      prev.map((i) => (i.id === item.id ? { ...i, visible: checked } : i)),
     );
   };