重新设计弹出组件的层次布局，非常驻窗口将置于顶部；新增变量控制水流图层的显示；完善历史数据面板的设计

src/app/OlMap/Controls/HistoryDataPanel.tsx

@@ -12,7 +12,6 @@ import {
   Tabs,
   Tooltip,
   Typography,
-  Drawer,
 } from "@mui/material";
 import { Refresh, ShowChart, TableChart } from "@mui/icons-material";
 import { DataGrid, GridColDef } from "@mui/x-data-grid";
@@ -649,34 +648,38 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
   return (
     <>
       {/* 主面板 */}
-      <Drawer
-        anchor="right"
-        variant="persistent"
-        hideBackdrop
+      <Box
         sx={{
-          width: 0,
-          flexShrink: 0,
-          "& .MuiDrawer-paper": {
-            width: "min(920px, calc(100vw - 2rem))",
-            boxSizing: "border-box",
-            position: "absolute",
-            top: 80,
-            right: 16,
-            height: "860px",
-            borderRadius: "12px",
-            boxShadow:
-              "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
-            backdropFilter: "blur(8px)",
-            opacity: 0.95,
-            transition: "transform 0.3s ease-in-out, opacity 0.3s ease-in-out",
-            border: "none",
-            "&:hover": {
-              opacity: 1,
-            },
+          position: "fixed",
+          left: "50%",
+          top: "50%",
+          transform: "translate(-50%, -50%)",
+          width: "min(920px, calc(100vw - 2rem))",
+          maxWidth: "100vw",
+          height: "860px",
+          maxHeight: "calc(100vh - 2rem)",
+          boxSizing: "border-box",
+          borderRadius: "12px",
+          boxShadow:
+            "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
+          backdropFilter: "blur(8px)",
+          opacity: 0.95,
+          transition: "opacity 0.3s ease-in-out",
+          border: "none",
+          display: "flex",
+          flexDirection: "column",
+          zIndex: 1300,
+          backgroundColor: "white",
+          overflow: "hidden",
+          "&:hover": {
+            opacity: 1,
           },
         }}
       >
-        <Box className="flex flex-col h-full bg-white rounded-xl overflow-hidden">
+        <Box
+          className="flex flex-col h-full rounded-xl"
+          sx={{ height: "100%", width: "100%" }}
+        >
           {/* Header */}
           <Box
             sx={{
@@ -852,7 +855,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
             {activeTab === "chart" ? renderChart() : renderTable()}
           </Box>
         </Box>
-      </Drawer>
+      </Box>
     </>
   );
 };