删除多余的参数,删除多余Label
This commit is contained in:
@@ -53,14 +53,6 @@ export interface SCADADataPanelProps {
|
|||||||
scheme_type?: string;
|
scheme_type?: string;
|
||||||
/** 策略名称 */
|
/** 策略名称 */
|
||||||
scheme_name?: string;
|
scheme_name?: string;
|
||||||
/** 自定义数据获取器,默认使用后端 API */
|
|
||||||
fetchTimeSeriesData?: (
|
|
||||||
featureInfos: [string, string][],
|
|
||||||
range: { from: Date; to: Date },
|
|
||||||
type?: "realtime" | "scheme" | "none",
|
|
||||||
scheme_type?: string,
|
|
||||||
scheme_name?: string
|
|
||||||
) => Promise<TimeSeriesPoint[]>;
|
|
||||||
/** 默认展示的选项卡 */
|
/** 默认展示的选项卡 */
|
||||||
defaultTab?: "chart" | "table";
|
defaultTab?: "chart" | "table";
|
||||||
/** Y 轴数值的小数位数 */
|
/** Y 轴数值的小数位数 */
|
||||||
@@ -77,7 +69,7 @@ type LoadingState = "idle" | "loading" | "success" | "error";
|
|||||||
const fetchFromBackend = async (
|
const fetchFromBackend = async (
|
||||||
featureInfos: [string, string][],
|
featureInfos: [string, string][],
|
||||||
range: { from: Date; to: Date },
|
range: { from: Date; to: Date },
|
||||||
type: "realtime" | "scheme" | "none" = "realtime",
|
type: "realtime" | "scheme" | "none",
|
||||||
scheme_type?: string,
|
scheme_type?: string,
|
||||||
scheme_name?: string
|
scheme_name?: string
|
||||||
): Promise<TimeSeriesPoint[]> => {
|
): Promise<TimeSeriesPoint[]> => {
|
||||||
@@ -332,8 +324,6 @@ const mergeTimeSeriesData = (
|
|||||||
return result;
|
return result;
|
||||||
};
|
};
|
||||||
|
|
||||||
const defaultFetcher = fetchFromBackend;
|
|
||||||
|
|
||||||
const formatTimestamp = (timestamp: string) =>
|
const formatTimestamp = (timestamp: string) =>
|
||||||
dayjs(timestamp).tz("Asia/Shanghai").format("YYYY-MM-DD HH:mm");
|
dayjs(timestamp).tz("Asia/Shanghai").format("YYYY-MM-DD HH:mm");
|
||||||
|
|
||||||
@@ -393,17 +383,12 @@ const emptyStateMessages: Record<
|
|||||||
|
|
||||||
const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
||||||
featureInfos,
|
featureInfos,
|
||||||
type = "realtime",
|
type = "none",
|
||||||
scheme_type,
|
scheme_type = "burst_Analysis",
|
||||||
scheme_name,
|
scheme_name,
|
||||||
fetchTimeSeriesData = defaultFetcher,
|
|
||||||
defaultTab = "chart",
|
defaultTab = "chart",
|
||||||
fractionDigits = 2,
|
fractionDigits = 2,
|
||||||
}) => {
|
}) => {
|
||||||
const customFetcher = useMemo(() => {
|
|
||||||
return fetchTimeSeriesData;
|
|
||||||
}, [fetchTimeSeriesData]);
|
|
||||||
|
|
||||||
// 从 featureInfos 中提取设备 ID 列表
|
// 从 featureInfos 中提取设备 ID 列表
|
||||||
const deviceIds = useMemo(
|
const deviceIds = useMemo(
|
||||||
() => featureInfos.map(([id]) => id),
|
() => featureInfos.map(([id]) => id),
|
||||||
@@ -416,42 +401,11 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
const [timeSeries, setTimeSeries] = useState<TimeSeriesPoint[]>([]);
|
const [timeSeries, setTimeSeries] = useState<TimeSeriesPoint[]>([]);
|
||||||
const [loadingState, setLoadingState] = useState<LoadingState>("idle");
|
const [loadingState, setLoadingState] = useState<LoadingState>("idle");
|
||||||
const [error, setError] = useState<string | null>(null);
|
const [error, setError] = useState<string | null>(null);
|
||||||
const [deviceLabels, setDeviceLabels] = useState<Record<string, string>>({});
|
|
||||||
const [selectedSource, setSelectedSource] = useState<
|
const [selectedSource, setSelectedSource] = useState<
|
||||||
"raw" | "clean" | "sim" | "all"
|
"raw" | "clean" | "sim" | "all"
|
||||||
>(() => (featureInfos.length === 1 ? "all" : "clean"));
|
>(() => (featureInfos.length === 1 ? "all" : "clean"));
|
||||||
const draggableRef = useRef<HTMLDivElement>(null);
|
const draggableRef = useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
// 获取 SCADA 设备信息,生成 deviceLabels
|
|
||||||
useEffect(() => {
|
|
||||||
const fetchDeviceLabels = async () => {
|
|
||||||
try {
|
|
||||||
const url = `${config.MAP_URL}/${config.MAP_WORKSPACE}/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=${config.MAP_WORKSPACE}:geo_scada&outputFormat=application/json`;
|
|
||||||
const response = await fetch(url);
|
|
||||||
if (!response.ok) return;
|
|
||||||
|
|
||||||
const json = await response.json();
|
|
||||||
const features = new GeoJSON().readFeatures(json);
|
|
||||||
|
|
||||||
const labels = features.reduce<Record<string, string>>(
|
|
||||||
(acc, feature) => {
|
|
||||||
const id = feature.get("id") || feature.getId();
|
|
||||||
const name = feature.get("name") || id;
|
|
||||||
acc[id] = name;
|
|
||||||
return acc;
|
|
||||||
},
|
|
||||||
{}
|
|
||||||
);
|
|
||||||
|
|
||||||
setDeviceLabels(labels);
|
|
||||||
} catch (error) {
|
|
||||||
console.error("[SCADADataPanel] 获取设备标签失败:", error);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
fetchDeviceLabels();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setActiveTab(defaultTab);
|
setActiveTab(defaultTab);
|
||||||
}, [defaultTab]);
|
}, [defaultTab]);
|
||||||
@@ -479,7 +433,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
setError(null);
|
setError(null);
|
||||||
try {
|
try {
|
||||||
const { from: rangeFrom, to: rangeTo } = normalizedRange;
|
const { from: rangeFrom, to: rangeTo } = normalizedRange;
|
||||||
const result = await customFetcher(
|
const result = await fetchFromBackend(
|
||||||
featureInfos,
|
featureInfos,
|
||||||
{
|
{
|
||||||
from: rangeFrom.toDate(),
|
from: rangeFrom.toDate(),
|
||||||
@@ -496,15 +450,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
setLoadingState("error");
|
setLoadingState("error");
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[
|
[featureInfos, hasDevices, normalizedRange, type, scheme_type, scheme_name]
|
||||||
featureInfos,
|
|
||||||
customFetcher,
|
|
||||||
hasDevices,
|
|
||||||
normalizedRange,
|
|
||||||
type,
|
|
||||||
scheme_type,
|
|
||||||
scheme_name,
|
|
||||||
]
|
|
||||||
);
|
);
|
||||||
|
|
||||||
// 设备变化时自动查询
|
// 设备变化时自动查询
|
||||||
@@ -537,8 +483,6 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
const cols: GridColDef[] = [];
|
const cols: GridColDef[] = [];
|
||||||
|
|
||||||
deviceIds.forEach((id) => {
|
deviceIds.forEach((id) => {
|
||||||
const deviceName = deviceLabels?.[id] ?? id;
|
|
||||||
|
|
||||||
// 为每个设备的每种数据类型创建列
|
// 为每个设备的每种数据类型创建列
|
||||||
const suffixes = [
|
const suffixes = [
|
||||||
{ key: "clean", name: "清洗值" },
|
{ key: "clean", name: "清洗值" },
|
||||||
@@ -557,7 +501,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
if (hasData) {
|
if (hasData) {
|
||||||
cols.push({
|
cols.push({
|
||||||
field: fieldKey,
|
field: fieldKey,
|
||||||
headerName: `${deviceName} (${name})`,
|
headerName: `${id} (${name})`,
|
||||||
minWidth: 140,
|
minWidth: 140,
|
||||||
flex: 1,
|
flex: 1,
|
||||||
valueFormatter: (value: any) => {
|
valueFormatter: (value: any) => {
|
||||||
@@ -576,7 +520,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
})();
|
})();
|
||||||
|
|
||||||
return [...base, ...dynamic];
|
return [...base, ...dynamic];
|
||||||
}, [deviceIds, deviceLabels, fractionDigits, dataset]);
|
}, [deviceIds, fractionDigits, dataset]);
|
||||||
|
|
||||||
const rows = useMemo(
|
const rows = useMemo(
|
||||||
() =>
|
() =>
|
||||||
@@ -653,7 +597,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
: "策略模拟";
|
: "策略模拟";
|
||||||
|
|
||||||
series.push({
|
series.push({
|
||||||
name: `${deviceLabels?.[id] ?? id} (${displayName})`,
|
name: `${id} (${displayName})`,
|
||||||
type: "line",
|
type: "line",
|
||||||
symbol: "none",
|
symbol: "none",
|
||||||
sampling: "lttb",
|
sampling: "lttb",
|
||||||
@@ -680,7 +624,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
|
|||||||
// 如果没有任何数据,则使用fallback
|
// 如果没有任何数据,则使用fallback
|
||||||
if (series.length === 0) {
|
if (series.length === 0) {
|
||||||
series.push({
|
series.push({
|
||||||
name: deviceLabels?.[id] ?? id,
|
name: id,
|
||||||
type: "line",
|
type: "line",
|
||||||
symbol: "none",
|
symbol: "none",
|
||||||
sampling: "lttb",
|
sampling: "lttb",
|
||||||
|
|||||||
Reference in New Issue
Block a user