refactor(frontend): align TJWater Next integrations

src/components/olmap/FlushingAnalysis/SchemeQuery.tsx

@@ -26,9 +26,9 @@ import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
 import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
 import "dayjs/locale/zh-cn";
 import dayjs, { Dayjs } from "dayjs";
-import { api } from "@/lib/api";
+import { listAnalysisSchemes } from "@/lib/analysisRuns";
 import moment from "moment";
-import { config, NETWORK_NAME } from "@config/config";
+import { NETWORK_NAME } from "@config/config";
 import { useNotification } from "@refinedev/core";
 import { useData, useMap } from "@components/olmap/core/MapComponent";
 import { queryFeaturesByIds } from "@/utils/mapQueryService";
@@ -40,7 +40,7 @@ import { Style, Icon, Circle, Fill, Stroke } from "ol/style";
 import Feature, { FeatureLike } from "ol/Feature";
 import { bbox, featureCollection } from "@turf/turf";
 import Timeline from "@components/olmap/core/Controls/Timeline";
-import { SchemeRecord, SchemaItem } from "./types";
+import { SchemeRecord } from "./types";
 import { FLOW_DISPLAY_UNIT } from "@utils/units";
 import { useSchemeCreatorName } from "@components/olmap/core/useSchemeCreatorName";
 import { SchemeQueryEmptyState } from "@components/olmap/common/PanelEmptyState";
@@ -59,7 +59,7 @@ const SCHEME_TYPE = "flushing_analysis";
 export interface FlushingSchemeQueryState {
   queryAll: boolean;
   queryDate: Dayjs | null;
-  expandedId: number | null;
+  expandedId: string | null;
   showTimeline: boolean;
   selectedDate: Date | undefined;
   timeRange: { start: Date; end: Date } | undefined;
@@ -111,7 +111,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
   const { open } = useNotification();
   const map = useMap();
   const data = useData();
-  const { schemeName, setSchemeName } = data || {};
+  const { schemeName, setSchemeName, schemeRunId, setSchemeRunId } = data || {};
 
   const schemes = externalSchemes !== undefined ? externalSchemes : internalSchemes;
   const setSchemes = onSchemesChange || setInternalSchemes;
@@ -214,7 +214,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
 
   const handleLocateDrainageNode = (nodeId: string) => {
     if (!nodeId) return;
-    queryFeaturesByIds([nodeId], "geo_junctions_mat").then((features) => {
+    queryFeaturesByIds([nodeId], "junctions").then((features) => {
       if (features.length > 0) {
         // Add type property to distinguish styling
         features.forEach(f => f.set("type", "drainage"));
@@ -231,7 +231,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
 
   const handleLocateValves = (valveIds: string[]) => {
     if (!valveIds || valveIds.length === 0) return;
-    queryFeaturesByIds(valveIds, "geo_valves").then((features) => {
+    queryFeaturesByIds(valveIds, "valves").then((features) => {
       if (features.length > 0) {
         features.forEach(f => f.set("type", "valve"));
         setHighlightFeatures(features);
@@ -269,42 +269,16 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
 
     setLoading(true);
     try {
-      const params: Record<string, string> = {
-        scheme_type: SCHEME_TYPE,
-      };
-      if (!queryAll && queryDate) {
-        params.query_date = queryDate.startOf("day").toISOString();
-      }
-      const response = await api.get(`${config.BACKEND_URL}/api/v1/schemes`, {
-        params,
-      });
-
-      let filteredResults = response.data;
-
-      // Filter by type
-      filteredResults = filteredResults.filter((item: SchemaItem) => item.scheme_type === SCHEME_TYPE);
-
-      if (!queryAll && queryDate) {
-        const formattedDate = queryDate.format("YYYY-MM-DD");
-        filteredResults = filteredResults.filter((item: SchemaItem) => {
-          const itemDate = moment(item.create_time).format("YYYY-MM-DD");
-          return itemDate === formattedDate;
-        });
-      }
-
-      const nextSchemes = filteredResults.map((item: SchemaItem) => ({
-        id: item.scheme_id,
-        schemeName: item.scheme_name,
-        type: item.scheme_type,
-        username: item.username,
-        create_time: item.create_time,
-        startTime: item.scheme_start_time,
-        schemeDetail: item.scheme_detail,
-      }));
+      const nextSchemes = (await listAnalysisSchemes({
+        runType: SCHEME_TYPE,
+        queryDate: !queryAll && queryDate
+          ? queryDate.format("YYYY-MM-DD")
+          : undefined,
+      })) as unknown as SchemeRecord[];
       setSchemes(nextSchemes);
       setQueryField("hasQueried", true);
 
-      if (filteredResults.length === 0) {
+      if (nextSchemes.length === 0) {
         open?.({
           type: "success",
           message: "未找到相关方案",
@@ -314,7 +288,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
         open?.({
           type: "success",
           message: "查询成功",
-          description: `共找到 ${filteredResults.length} 条方案记录`,
+          description: `共找到 ${nextSchemes.length} 条方案记录`,
         });
       }
     } catch (error) {
@@ -346,6 +320,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
     }
 
     setSchemeName?.(scheme.schemeName);
+    setSchemeRunId?.(scheme.id);
 
     // Locate drainage node by default if available
     if (scheme.schemeDetail?.drainage_node_ID) {
@@ -363,6 +338,7 @@ const SchemeQuery: React.FC<SchemeQueryProps> = ({
             timeRange={timeRange}
             disableDateSelection={!!timeRange}
             schemeName={schemeName}
+            schemeRunId={schemeRunId}
             schemeType={SCHEME_TYPE}
           />,
           mapContainer,