更新地图样式；调整时间轴，新增前进/后退一天按钮；新增爆管分析页面

src/components/olmap/BurstPipeAnalysis/SchemeQuery.tsx

@@ -0,0 +1,190 @@
+"use client";
+
+import React, { useState } from "react";
+import {
+  Box,
+  Button,
+  Typography,
+  Checkbox,
+  FormControlLabel,
+  Table,
+  TableBody,
+  TableCell,
+  TableContainer,
+  TableHead,
+  TableRow,
+  Paper,
+  IconButton,
+} from "@mui/material";
+import {
+  Info as InfoIcon,
+  LocationOn as LocationIcon,
+} from "@mui/icons-material";
+import { DatePicker } from "@mui/x-date-pickers/DatePicker";
+import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
+import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
+import dayjs, { Dayjs } from "dayjs";
+import "dayjs/locale/zh-cn";
+
+interface SchemeRecord {
+  id: number;
+  schemeName: string;
+  type: string;
+  user: string;
+  createTime: string;
+  startTime: string;
+}
+
+interface SchemeQueryProps {
+  onViewDetails?: (id: number) => void;
+  onLocate?: (id: number) => void;
+}
+
+const SchemeQuery: React.FC<SchemeQueryProps> = ({
+  onViewDetails,
+  onLocate,
+}) => {
+  const [queryAll, setQueryAll] = useState<boolean>(true);
+  const [queryDate, setQueryDate] = useState<Dayjs | null>(dayjs("2025-10-21"));
+  const [schemes, setSchemes] = useState<SchemeRecord[]>([]);
+
+  const handleQuery = () => {
+    // TODO: 实际查询逻辑
+    console.log("查询方案", { queryAll, queryDate });
+    // 这里应该调用API获取数据
+  };
+
+  return (
+    <Box className="flex flex-col h-full">
+      {/* 查询条件 */}
+      <Box className="mb-4 p-4 bg-gray-50 rounded">
+        <Box className="flex items-center gap-4 mb-3">
+          <FormControlLabel
+            control={
+              <Checkbox
+                checked={queryAll}
+                onChange={(e) => setQueryAll(e.target.checked)}
+              />
+            }
+            label="查询全部"
+          />
+          <LocalizationProvider
+            dateAdapter={AdapterDayjs}
+            adapterLocale="zh-cn"
+          >
+            <DatePicker
+              value={queryDate}
+              onChange={(value) =>
+                value && dayjs.isDayjs(value) && setQueryDate(value)
+              }
+              format="YYYY-MM-DD"
+              disabled={queryAll}
+              slotProps={{
+                textField: {
+                  size: "small",
+                  className: "flex-1",
+                },
+              }}
+            />
+          </LocalizationProvider>
+        </Box>
+        <Button
+          fullWidth
+          variant="contained"
+          onClick={handleQuery}
+          className="bg-blue-600 hover:bg-blue-700"
+        >
+          查询
+        </Button>
+      </Box>
+
+      {/* 结果列表 */}
+      <Box className="flex-1 overflow-auto">
+        {schemes.length === 0 ? (
+          <Box className="flex flex-col items-center justify-center h-full text-gray-400">
+            <Box className="mb-4">
+              <svg
+                width="80"
+                height="80"
+                viewBox="0 0 80 80"
+                fill="none"
+                className="opacity-40"
+              >
+                <rect
+                  x="10"
+                  y="20"
+                  width="60"
+                  height="45"
+                  rx="2"
+                  stroke="currentColor"
+                  strokeWidth="2"
+                />
+                <line
+                  x1="10"
+                  y1="30"
+                  x2="70"
+                  y2="30"
+                  stroke="currentColor"
+                  strokeWidth="2"
+                />
+              </svg>
+            </Box>
+            <Typography variant="body2">总共 0 条</Typography>
+            <Typography variant="body2" className="mt-1">
+              No data
+            </Typography>
+          </Box>
+        ) : (
+          <TableContainer component={Paper} className="shadow-none">
+            <Table size="small">
+              <TableHead>
+                <TableRow className="bg-gray-50">
+                  <TableCell>ID</TableCell>
+                  <TableCell>方案名称</TableCell>
+                  <TableCell>类型</TableCell>
+                  <TableCell>用户</TableCell>
+                  <TableCell>创建时间</TableCell>
+                  <TableCell>开始时间</TableCell>
+                  <TableCell align="center">详情</TableCell>
+                  <TableCell align="center">定位</TableCell>
+                </TableRow>
+              </TableHead>
+              <TableBody>
+                {schemes.map((scheme) => (
+                  <TableRow key={scheme.id} hover>
+                    <TableCell>{scheme.id}</TableCell>
+                    <TableCell>{scheme.schemeName}</TableCell>
+                    <TableCell>{scheme.type}</TableCell>
+                    <TableCell>{scheme.user}</TableCell>
+                    <TableCell>{scheme.createTime}</TableCell>
+                    <TableCell>{scheme.startTime}</TableCell>
+                    <TableCell align="center">
+                      <IconButton
+                        size="small"
+                        onClick={() => onViewDetails?.(scheme.id)}
+                        color="primary"
+                      >
+                        <InfoIcon fontSize="small" />
+                      </IconButton>
+                    </TableCell>
+                    <TableCell align="center">
+                      <IconButton
+                        size="small"
+                        onClick={() => onLocate?.(scheme.id)}
+                        color="primary"
+                      >
+                        <LocationIcon fontSize="small" />
+                      </IconButton>
+                    </TableCell>
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          </TableContainer>
+        )}
+      </Box>
+    </Box>
+  );
+};
+
+export default SchemeQuery;