重新设计关阀分析模块
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import React, { useEffect, useRef, useState } from "react";
|
import React, { useState } from "react";
|
||||||
import {
|
import {
|
||||||
Box,
|
Box,
|
||||||
Drawer,
|
Drawer,
|
||||||
@@ -65,9 +65,6 @@ const BurstPipeAnalysisPanel: React.FC<BurstPipeAnalysisPanelProps> = ({
|
|||||||
const [internalOpen, setInternalOpen] = useState(true);
|
const [internalOpen, setInternalOpen] = useState(true);
|
||||||
const [currentTab, setCurrentTab] = useState(0);
|
const [currentTab, setCurrentTab] = useState(0);
|
||||||
const [panelMode, setPanelMode] = useState<PanelMode>("burst");
|
const [panelMode, setPanelMode] = useState<PanelMode>("burst");
|
||||||
const previousMapText = useRef<{ junction?: string; pipe?: string } | null>(
|
|
||||||
null,
|
|
||||||
);
|
|
||||||
|
|
||||||
const data = useData();
|
const data = useData();
|
||||||
|
|
||||||
@@ -75,10 +72,6 @@ const BurstPipeAnalysisPanel: React.FC<BurstPipeAnalysisPanelProps> = ({
|
|||||||
const [schemes, setSchemes] = useState<SchemeRecord[]>([]);
|
const [schemes, setSchemes] = useState<SchemeRecord[]>([]);
|
||||||
// 定位结果数据
|
// 定位结果数据
|
||||||
const [locationResults, setLocationResults] = useState<LocationResult[]>([]);
|
const [locationResults, setLocationResults] = useState<LocationResult[]>([]);
|
||||||
// 选中的管段ID数组
|
|
||||||
const [selectedPipeIds, setSelectedPipeIds] = useState<string[]>([]);
|
|
||||||
// 关阀分析状态提升到父组件
|
|
||||||
const [valveAnalysisTriggered, setValveAnalysisTriggered] = useState(false);
|
|
||||||
// 关阀分析结果和加载状态
|
// 关阀分析结果和加载状态
|
||||||
const [valveAnalysisLoading, setValveAnalysisLoading] = useState(false);
|
const [valveAnalysisLoading, setValveAnalysisLoading] = useState(false);
|
||||||
const [valveAnalysisResult, setValveAnalysisResult] = useState<ValveIsolationResult | null>(null);
|
const [valveAnalysisResult, setValveAnalysisResult] = useState<ValveIsolationResult | null>(null);
|
||||||
@@ -126,12 +119,6 @@ const BurstPipeAnalysisPanel: React.FC<BurstPipeAnalysisPanelProps> = ({
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleAnalyzePipe = (pipeIds: string[]) => {
|
|
||||||
setSelectedPipeIds(pipeIds);
|
|
||||||
setValveAnalysisTriggered(true);
|
|
||||||
setCurrentTab(3);
|
|
||||||
};
|
|
||||||
|
|
||||||
const drawerWidth = 520;
|
const drawerWidth = 520;
|
||||||
const isBurstMode = panelMode === "burst";
|
const isBurstMode = panelMode === "burst";
|
||||||
const panelTitle = isBurstMode ? "爆管分析" : "水质模拟";
|
const panelTitle = isBurstMode ? "爆管分析" : "水质模拟";
|
||||||
@@ -308,7 +295,6 @@ const BurstPipeAnalysisPanel: React.FC<BurstPipeAnalysisPanelProps> = ({
|
|||||||
{isBurstMode ? (
|
{isBurstMode ? (
|
||||||
<LocationResults
|
<LocationResults
|
||||||
results={locationResults}
|
results={locationResults}
|
||||||
onAnalyze={handleAnalyzePipe}
|
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<ContaminantResultsPanel schemeName={data?.schemeName} />
|
<ContaminantResultsPanel schemeName={data?.schemeName} />
|
||||||
@@ -318,9 +304,6 @@ const BurstPipeAnalysisPanel: React.FC<BurstPipeAnalysisPanelProps> = ({
|
|||||||
{isBurstMode && (
|
{isBurstMode && (
|
||||||
<TabPanel value={currentTab} index={3}>
|
<TabPanel value={currentTab} index={3}>
|
||||||
<ValveIsolation
|
<ValveIsolation
|
||||||
initialPipeIds={selectedPipeIds}
|
|
||||||
shouldFetch={valveAnalysisTriggered}
|
|
||||||
onFetchComplete={() => setValveAnalysisTriggered(false)}
|
|
||||||
loading={valveAnalysisLoading}
|
loading={valveAnalysisLoading}
|
||||||
result={valveAnalysisResult}
|
result={valveAnalysisResult}
|
||||||
onLoadingChange={setValveAnalysisLoading}
|
onLoadingChange={setValveAnalysisLoading}
|
||||||
|
|||||||
@@ -11,7 +11,6 @@ import {
|
|||||||
} from "@mui/material";
|
} from "@mui/material";
|
||||||
import {
|
import {
|
||||||
LocationOn as LocationIcon,
|
LocationOn as LocationIcon,
|
||||||
Handyman as HandymanIcon,
|
|
||||||
} from "@mui/icons-material";
|
} from "@mui/icons-material";
|
||||||
import { queryFeaturesByIds } from "@/utils/mapQueryService";
|
import { queryFeaturesByIds } from "@/utils/mapQueryService";
|
||||||
import { useMap } from "@app/OlMap/MapComponent";
|
import { useMap } from "@app/OlMap/MapComponent";
|
||||||
@@ -36,12 +35,10 @@ import { LocationResult } from "./types";
|
|||||||
|
|
||||||
interface LocationResultsProps {
|
interface LocationResultsProps {
|
||||||
results?: LocationResult[];
|
results?: LocationResult[];
|
||||||
onAnalyze?: (pipeIds: string[]) => void;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const LocationResults: React.FC<LocationResultsProps> = ({
|
const LocationResults: React.FC<LocationResultsProps> = ({
|
||||||
results = [],
|
results = [],
|
||||||
onAnalyze,
|
|
||||||
}) => {
|
}) => {
|
||||||
const [highlightLayer, setHighlightLayer] =
|
const [highlightLayer, setHighlightLayer] =
|
||||||
useState<VectorLayer<VectorSource> | null>(null);
|
useState<VectorLayer<VectorSource> | null>(null);
|
||||||
@@ -349,23 +346,6 @@ const LocationResults: React.FC<LocationResultsProps> = ({
|
|||||||
管段列表
|
管段列表
|
||||||
</Typography>
|
</Typography>
|
||||||
<Box className="flex items-center gap-2">
|
<Box className="flex items-center gap-2">
|
||||||
{onAnalyze && (
|
|
||||||
<Tooltip title="关阀分析">
|
|
||||||
<IconButton
|
|
||||||
size="small"
|
|
||||||
onClick={() => onAnalyze(result.locate_result!)}
|
|
||||||
color="secondary"
|
|
||||||
sx={{
|
|
||||||
backgroundColor: "rgba(156, 39, 176, 0.1)",
|
|
||||||
"&:hover": {
|
|
||||||
backgroundColor: "rgba(156, 39, 176, 0.2)",
|
|
||||||
},
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<HandymanIcon sx={{ fontSize: "1.2rem" }} />
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>
|
|
||||||
)}
|
|
||||||
<Tooltip title="定位所有管道">
|
<Tooltip title="定位所有管道">
|
||||||
<IconButton
|
<IconButton
|
||||||
size="small"
|
size="small"
|
||||||
@@ -404,25 +384,6 @@ const LocationResults: React.FC<LocationResultsProps> = ({
|
|||||||
{pipeId}
|
{pipeId}
|
||||||
</Typography>
|
</Typography>
|
||||||
<Box className="flex items-center gap-1">
|
<Box className="flex items-center gap-1">
|
||||||
{onAnalyze && (
|
|
||||||
<Tooltip title="单管段关阀分析">
|
|
||||||
<IconButton
|
|
||||||
size="small"
|
|
||||||
onClick={(e) => {
|
|
||||||
e.stopPropagation();
|
|
||||||
onAnalyze([pipeId]);
|
|
||||||
}}
|
|
||||||
className="text-blue-400 hover:text-blue-600"
|
|
||||||
sx={{
|
|
||||||
"&:hover": {
|
|
||||||
backgroundColor: "rgba(37, 125, 212, 0.1)",
|
|
||||||
},
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<HandymanIcon sx={{ fontSize: "1rem" }} />
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>
|
|
||||||
)}
|
|
||||||
{/* <Tooltip title="定位管段">
|
{/* <Tooltip title="定位管段">
|
||||||
<IconButton
|
<IconButton
|
||||||
size="small"
|
size="small"
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user