feat(ui): 统一面板空状态引导

src/components/olmap/BurstSimulation/AnalysisReport.test.tsx

@@ -62,6 +62,24 @@ describe("AnalysisReport", () => {
     document.body.classList.remove("burst-analysis-report-printing");
   });
 
+  it("guides the user to choose a scheme when no report is active", () => {
+    render(
+      <AnalysisReport
+        scheme={null}
+        valveResult={null}
+        disabledValves={[]}
+        generatedAt={null}
+      />,
+    );
+
+    expect(screen.getByText("尚未选择分析方案")).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "请在“方案查询”中打开一个方案，再查看分析报告。",
+      ),
+    ).toBeInTheDocument();
+  });
+
   it("renders the selected scheme, pipe data, and matching valve result", async () => {
     render(
       <AnalysisReport

src/components/olmap/BurstSimulation/AnalysisReport.tsx

@@ -35,6 +35,7 @@ import {
   type PipeDiameterMap,
 } from "./schemePipeDiameters";
 import { SchemeRecord, ValveIsolationResult } from "./types";
+import PanelEmptyState from "@components/olmap/common/PanelEmptyState";
 
 interface AnalysisReportProps {
   scheme: SchemeRecord | null;
@@ -516,15 +517,11 @@ const AnalysisReport: React.FC<AnalysisReportProps> = ({
 
   if (!scheme) {
     return (
-      <Box className="flex h-full flex-col items-center justify-center px-6 text-center">
-        <DescriptionOutlined sx={{ mb: 2, fontSize: 52, color: "#94a3b8" }} />
-        <Typography variant="h6" className="font-bold text-gray-700">
-          等待选择分析方案
-        </Typography>
-        <Typography variant="body2" className="mt-2 text-gray-500">
-          请在“方案查询”中点击“查看分析报告”。
-        </Typography>
-      </Box>
+      <PanelEmptyState
+        icon={<DescriptionOutlined />}
+        title="尚未选择分析方案"
+        description="请在“方案查询”中打开一个方案，再查看分析报告。"
+      />
     );
   }
 

src/components/olmap/BurstSimulation/SchemeQuery.tsx

@@ -57,6 +57,7 @@ import {
   type PipeDiameterMap,
 } from "./schemePipeDiameters";
 import { useSchemeCreatorName } from "@components/olmap/core/useSchemeCreatorName";
+import { SchemeQueryEmptyState } from "@components/olmap/common/PanelEmptyState";
 
 interface SchemeQueryProps {
   schemes?: SchemeRecord[];
@@ -76,6 +77,7 @@ export interface BurstSchemeQueryState {
   selectedDate: Date | undefined;
   timeRange: { start: Date; end: Date } | undefined;
   expandedId: number | null;
+  hasQueried: boolean;
 }
 
 export const createBurstSchemeQueryState = (): BurstSchemeQueryState => ({
@@ -85,6 +87,7 @@ export const createBurstSchemeQueryState = (): BurstSchemeQueryState => ({
   selectedDate: undefined,
   timeRange: undefined,
   expandedId: null,
+  hasQueried: false,
 });
 
 const SchemeQuery: React.FC<SchemeQueryProps> = ({
@@ -107,6 +110,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
     selectedDate,
     timeRange,
     expandedId,
+    hasQueried,
   } = queryState;
   const [highlightLayer, setHighlightLayer] =
     useState<VectorLayer<VectorSource> | null>(null);
@@ -185,6 +189,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
         schemeDetail: item.scheme_detail,
       }));
       setSchemes(nextSchemes);
+      setQueryField("hasQueried", true);
 
       if (filteredResults.length === 0) {
         open?.({
@@ -462,7 +467,10 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
                 control={
                   <Checkbox
                     checked={queryAll}
-                    onChange={(e) => setQueryField("queryAll", e.target.checked)}
+                    onChange={(e) => {
+                      setQueryField("queryAll", e.target.checked);
+                      setQueryField("hasQueried", false);
+                    }}
                     size="small"
                   />
                 }
@@ -475,9 +483,12 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
               >
                 <DatePicker
                   value={queryDate}
-                  onChange={(value) =>
-                    value && dayjs.isDayjs(value) && setQueryField("queryDate", value)
-                  }
+                  onChange={(value) => {
+                    if (value && dayjs.isDayjs(value)) {
+                      setQueryField("queryDate", value);
+                      setQueryField("hasQueried", false);
+                    }
+                  }}
                   format="YYYY-MM-DD"
                   disabled={queryAll}
                   slotProps={{
@@ -505,39 +516,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
         {/* 结果列表 */}
         <Box className="flex-1 overflow-auto">
           {filteredSchemes.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>
+            <SchemeQueryEmptyState hasQueried={hasQueried} />
           ) : (
             <Box className="space-y-2 p-2">
               <Typography variant="caption" className="text-gray-500 px-2">