统一流量单位为 m³/h,优化相关组件

This commit is contained in:
JIANG
2026-03-07 17:21:01 +08:00
parent 6b68b7d081
commit ddb02cc688
10 changed files with 61 additions and 35 deletions
@@ -24,7 +24,7 @@ import dayjs, { Dayjs } from "dayjs";
import "dayjs/locale/zh-cn";
import { api } from "@/lib/api";
import { NETWORK_NAME, config } from "@config/config";
import { DMA_FLOW_DISPLAY_UNIT, toM3s } from "../DMALeakDetection/utils";
import { FLOW_DISPLAY_UNIT, toM3s } from "../DMALeakDetection/utils";
import { BurstLocationResult } from "./types";
interface Props {
@@ -180,7 +180,7 @@ const AnalysisParameters: React.FC<Props> = ({ onResult }) => {
network: NETWORK_NAME,
data_source: dataSource,
scheme_name: schemeName.trim() || undefined,
burst_leakage: toM3s(burstLeakage, DMA_FLOW_DISPLAY_UNIT),
burst_leakage: toM3s(burstLeakage, FLOW_DISPLAY_UNIT),
min_dpressure: minDpressure,
basic_pressure: basicPressure,
scada_burst_start: burstStartTime.toISOString(),
@@ -325,7 +325,7 @@ const AnalysisParameters: React.FC<Props> = ({ onResult }) => {
<Box className="flex flex-col gap-2">
<Typography variant="subtitle2" className="mb-1 font-medium">
({DMA_FLOW_DISPLAY_UNIT})
({FLOW_DISPLAY_UNIT})
</Typography>
<TextField
type="number"
@@ -6,6 +6,7 @@ import {
Typography,
Chip,
IconButton,
Tooltip,
Table,
TableBody,
TableCell,
@@ -28,7 +29,7 @@ import VectorSource from "ol/source/Vector";
import { Stroke, Style, Circle, Fill } from "ol/style";
import { bbox, featureCollection } from "@turf/turf";
import { BurstCandidate, BurstLocationResult } from "./types";
import { DMA_FLOW_DISPLAY_UNIT } from "../DMALeakDetection/utils";
import { FLOW_DISPLAY_UNIT } from "../DMALeakDetection/utils";
interface Props {
result: BurstLocationResult | null;
@@ -127,6 +128,14 @@ const LocationResults: React.FC<Props> = ({ result }) => {
return base;
}, [result]);
const allCandidatePipeIds = useMemo<string[]>(() => {
const ids = candidatePipes.map((item) => item.pipe_id);
if (result?.located_pipe) {
ids.unshift(result.located_pipe);
}
return Array.from(new Set(ids.filter(Boolean)));
}, [candidatePipes, result?.located_pipe]);
useEffect(() => {
if (!map) return;
@@ -263,7 +272,7 @@ const LocationResults: React.FC<Props> = ({ result }) => {
/>
<MetricCard
label="估计漏损量"
value={`${result.burst_leakage.toFixed(2)} ${DMA_FLOW_DISPLAY_UNIT}`}
value={`${result.burst_leakage.toFixed(2)} ${FLOW_DISPLAY_UNIT}`}
tone="orange"
/>
<MetricCard
@@ -288,18 +297,32 @@ const LocationResults: React.FC<Props> = ({ result }) => {
</Typography>
</Box>
<Chip
size="small"
label={`${candidatePipes.length}`}
sx={{
height: 22,
backgroundColor: "rgba(37, 99, 235, 0.08)",
color: "#2563eb",
fontWeight: 600,
fontSize: "0.75rem",
border: "none",
}}
/>
<Box className="flex items-center gap-1">
<Chip
size="small"
label={`${candidatePipes.length}`}
sx={{
height: 22,
backgroundColor: "rgba(37, 99, 235, 0.08)",
color: "#2563eb",
fontWeight: 600,
fontSize: "0.75rem",
border: "none",
}}
/>
<Tooltip title="定位所有管段">
<span>
<IconButton
size="small"
onClick={() => locatePipes(allCandidatePipeIds)}
disabled={allCandidatePipeIds.length === 0}
className="text-blue-600 hover:bg-blue-50 disabled:text-gray-300"
>
<LocationOnIcon fontSize="small" />
</IconButton>
</span>
</Tooltip>
</Box>
</Box>
<Table size="small">
<TableHead>
@@ -28,7 +28,7 @@ import {
BurstLocationSchemeDetail,
BurstSchemeRecord,
} from "./types";
import { DMA_FLOW_DISPLAY_UNIT } from "../DMALeakDetection/utils";
import { FLOW_DISPLAY_UNIT } from "../DMALeakDetection/utils";
interface Props {
onViewResult: (result: BurstLocationResult) => void;
@@ -302,7 +302,7 @@ const SchemeQuery: React.FC<Props> = ({ onViewResult }) => {
:
</Typography>
<Typography variant="caption" className="font-medium text-gray-900">
{typeof leakage === "number" ? `${leakage} ${DMA_FLOW_DISPLAY_UNIT}` : "-"}
{typeof leakage === "number" ? `${leakage} ${FLOW_DISPLAY_UNIT}` : "-"}
</Typography>
</Box>
<Box className="grid grid-cols-[78px_1fr] items-center gap-x-2">