添加测量相关接口

src/pages/measure/components/MeasureAction.tsx

@@ -1,47 +1,55 @@
 import { Button, Checkbox, CheckboxProps, Switch, RadioChangeEvent, message } from "antd";
 import { useState, useEffect } from "react";
 import { useNavigate } from "react-router";
-import { startMeasurement } from "../../../services/measure/analysis";
+import { saveMeasurement, startMeasurement } from "../../../services/measure/analysis";
 import { createWebSocket, sharedWsUrl } from "../../../services/socket";
 import GridLayer from "./graph/GridLayer";
 import StandardLayer from "./graph/StandardLayer";
 import ResultLayer from "./graph/ResultLayer";
 import MarkLayer from "./graph/MarkLayer";
+import { useDispatch, useSelector } from "react-redux";
+import { switchMeasureAfterSave } from "../../../store/features/contextSlice";
 
 export default function MeasureAction() {
+	const dispatch = useDispatch();
+
 	const [showGrid, setShowGrid] = useState(true);
 	const [showStandard, setShowStandard] = useState(true);
 	const [showResult, setShowResult] = useState(true);
 	const [showMark, setShowMark] = useState(true);
 
+	// @ts-ignore
+	const afterSave = useSelector(store => store.context.newMeasureAfterSave);
+
 	const navigate = useNavigate();
-	const [sideVal, setSideVal] = useState<1 | 2>(1);
 
-	const onSideChange = (e: RadioChangeEvent) => {
-		setSideVal(e.target.value);
-	};
 	const onAfterSaveChange: CheckboxProps["onChange"] = e => {
-		console.log(`checked = ${e.target.checked}`);
+		dispatch(switchMeasureAfterSave(e.target.checked));
 	};
 	const onAnalysisBtnClick = () => {
 		// navigate("../detail");
 	};
 
-	useEffect(() => {
-		connectWebpacket();
-	}, []);
-
-	const connectWebpacket = () => {
-		//连接websocket
-		const wsClient = createWebSocket(sharedWsUrl);
-		let subscription = wsClient.dataOb.subscribe(data => {});
-		wsClient.connect();
-	};
-
 	const onStart = () => {
 		startMeasurement().then(res => {
-			console.log("startMeasurement===", res);
-			message.success("已通知设备开始测量");
+			if (res.status !== 0) {
+				message.error(res.data.info);
+			} else {
+				message.success("已通知设备开始测量");
+			}
+		});
+	};
+
+	const onSaveBtnClick = () => {
+		saveMeasurement().then(res => {
+			if (res.status !== 0) {
+				message.error(res.data.info);
+			} else {
+				message.success("保存成功");
+				if (afterSave) {
+					navigate("../config");
+				}
+			}
 		});
 	};
 
@@ -125,24 +133,18 @@ export default function MeasureAction() {
 				<h1 className="font-medium text-xl text-center">测量步骤</h1>
 				<section className="flex flex-col items-center gap-4 mt-6 border-t border-[#D8D8D8] py-4">
 					<div>正在测量的状态</div>
-					{/* <Radio.Group
-						value={sideVal}
-						onChange={onSideChange}
-						options={[
-							{ value: 1, label: "测量左侧" },
-							{ value: 2, label: "测量右侧" },
-						]}
-					/> */}
 					<Button style={{ width: 200 }} size="large" type="primary" onClick={onStart}>
 						开始测量
 					</Button>
 					<Button style={{ width: 200 }} size="large" type="primary" onClick={onAnalysisBtnClick}>
 						分析
 					</Button>
-					<Button style={{ width: 200 }} size="large" type="primary">
+					<Button style={{ width: 200 }} size="large" type="primary" onClick={onSaveBtnClick}>
 						保存
 					</Button>
-					<Checkbox onChange={onAfterSaveChange}>保存后自动开始新测量</Checkbox>
+					<Checkbox checked={afterSave} onChange={onAfterSaveChange}>
+						保存后自动开始新测量
+					</Checkbox>
 				</section>
 			</div>
 		</div>

src/pages/measure/components/MeasureConfig.tsx

@@ -1,57 +1,91 @@
-import { Button, Form, Input, Select } from "antd";
+import { Button, Form, Input, message } from "antd";
+import { useEffect } from "react";
+import { useSelector } from "react-redux";
 import { useNavigate } from "react-router";
+import { createMeasure } from "../../../services/measure/analysis";
 
 export default function MeasureConfig() {
-    const navigate = useNavigate()
-    const onFinish = (values: any) => {
-        console.log('Received values of form: ', values);
-        navigate('../action')
-      };
+	const navigate = useNavigate();
+	const [messageApi, contextHolder] = message.useMessage();
+	//@ts-ignore
+	const context = useSelector(store => store.context);
+	const onFinish = (values: any) => {
+		console.log("Received values of form: ", values);
+		createMeasure({
+			operatorName: values["username"],
+			name: values["measureName"],
+			lineName: values["lineName"],
+			location: values["position"],
+		}).then(res => {
+			if (res.status !== 0) {
+				messageApi.error(res.data.info);
+			} else {
+				navigate("../action");
+			}
+		});
+	};
+
+	const [form] = Form.useForm();
+	useEffect(() => {
+		form.setFieldsValue({
+			username: context.loginUser.nickname || "",
+		});
+	}, [context.loginUser.nickname, form]);
 	return (
-		<div className="h-full flex justify-center items-center">
-			<Form
-				name="basic"
-				labelCol={{ span: 8 }}
-				wrapperCol={{ span: 16 }}
-				style={{ minWidth: 360, maxWidth: 600 }}
-				size="large"
-				initialValues={{ remember: true }}
-				onFinish={onFinish}
-				// onFinishFailed={onFinishFailed}
-				autoComplete="off">
-				<Form.Item label="操作员" name="username" rules={[{ required: true, message: "Please input your username!" }]}>
-					<Input />
-				</Form.Item>
+		<>
+			{contextHolder}
+
+			<div className="h-full flex justify-center items-center">
+				<Form
+					form={form}
+					labelCol={{ span: 8 }}
+					wrapperCol={{ span: 16 }}
+					style={{ minWidth: 360, maxWidth: 600 }}
+					size="large"
+					initialValues={{ remember: true }}
+					onFinish={onFinish}
+					// onFinishFailed={onFinishFailed}
+					autoComplete="off">
+					<Form.Item label="操作员" name="username">
+						<Input disabled />
+					</Form.Item>
 
-				<Form.Item label="轨型" name="trackType">
+					{/* <Form.Item label="轨型" name="trackType">
 					<Select>
 						<Select.Option value="demo">Demo</Select.Option>
 					</Select>
-				</Form.Item>
-				<Form.Item label="核校" name="calibrationType">
+				</Form.Item> */}
+					{/* <Form.Item label="核校" name="calibrationType">
 					<Select>
 						<Select.Option value="demo">Demo</Select.Option>
 					</Select>
-				</Form.Item>
-				<Form.Item label="测量名称" name="measureName" rules={[{ required: true, message: "Please input your username!" }]}>
-					<Input />
-				</Form.Item>
-				<Form.Item label="线路名称" name="lineName" rules={[{ required: true, message: "Please input your username!" }]}>
-					<Input />
-				</Form.Item>
-				<Form.Item label="位置" name="position" rules={[{ required: true, message: "Please input your username!" }]}>
-					<Input />
-				</Form.Item>
-				<Form.Item label="方向" name="direction" rules={[{ required: true, message: "Please input your username!" }]}>
+				</Form.Item> */}
+					<Form.Item
+						label="测量名称"
+						name="measureName"
+						rules={[{ required: true, message: "Please input your username!" }]}>
+						<Input />
+					</Form.Item>
+					<Form.Item
+						label="线路名称"
+						name="lineName"
+						rules={[{ required: true, message: "Please input your username!" }]}>
+						<Input />
+					</Form.Item>
+					<Form.Item label="位置" name="position" rules={[{ required: true, message: "Please input your username!" }]}>
+						<Input />
+					</Form.Item>
+					{/* <Form.Item label="方向" name="direction" rules={[{ required: true, message: "Please input your username!" }]}>
 					<Input />
-				</Form.Item>
+				</Form.Item> */}
 
-				<Form.Item label={null}>
-					<Button type="primary" size="large" style={{ width: 220 }} htmlType="submit">
-						开始测量
-					</Button>
-				</Form.Item>
-			</Form>
-		</div>
+					<Form.Item label={null}>
+						<Button type="primary" size="large" style={{ width: 220 }} htmlType="submit">
+							开始测量
+						</Button>
+					</Form.Item>
+				</Form>
+			</div>
+		</>
 	);
 }

src/services/measure/analysis.ts

@@ -1,16 +1,46 @@
 import httpRequest, { type BaseResponse } from "../httpRequest";
 import type { DetailTable } from "../../services/measure/type";
+
 export function startMeasurement() {
 	return httpRequest<BaseResponse>({
 		url: "/measurement-task/start-measurement",
 		method: "POST",
 	});
 }
-
+export function stopMeasurement() {
+	return httpRequest<BaseResponse>({
+		url: "/measurement-task/stop-measurement",
+		method: "POST",
+	});
+}
+export function saveMeasurement() {
+	return httpRequest<BaseResponse>({
+		url: "/measurement-task/save-report",
+		method: "POST",
+	});
+}
 
 export function getDetailList() {
-	return httpRequest<BaseResponse<{list:DetailTable[]}>>({
+	return httpRequest<BaseResponse<{ list: DetailTable[] }>>({
+		url: "/measurement-task/cache-measurement",
+		method: "POST",
+	});
+}
+
+export type MeasureRecord = {
+	operatorName: "张三"; //操作员名称
+	// trackShapeCode: "code01"; //轨形code
+	// verificationMethodCode: "code01"; //核校方式code
+	name: "某某铁路"; ///测量名称
+	lineName: "河北段"; //线路名称
+	location: "100米处"; //位置
+	// direction: "左"; //方向
+};
+
+export function createMeasure(params: MeasureRecord) {
+	return httpRequest<BaseResponse>({
 		url: "/measurement-task/cache-measurement",
+		params,
 		method: "POST",
 	});
 }

src/services/wsTypes.ts

@@ -20,7 +20,7 @@ export type TrackRecordSig = {
 export type ContextMessage = {
 	messageType: "DeviceContext";
 	data: {
-		loginFlag: Boolean;
+		loginFlag: boolean;
 		loginUser: Partial<{
 			id: number;
 			account: string;
@@ -29,6 +29,7 @@ export type ContextMessage = {
 			userRole: "Admin" | "User" | "Dev";
 			isBuiltInUser: boolean;
 		}>;
+		newMeasureAfterSave: boolean;
 	};
 	path: "/deviceContext";
 };

src/store/features/contextSlice.ts

@@ -6,6 +6,8 @@ import { ContextMessage } from "../../services/wsTypes";
 const initialState: ContextMessage["data"] = {
 	loginFlag: false,
 	loginUser: {},
+
+	newMeasureAfterSave: false,
 };
 
 // 创建一个 Slice
@@ -19,10 +21,13 @@ export const contextSlice = createSlice({
 			state.loginFlag = payload.loginFlag;
 			state.loginUser = payload.loginUser;
 		},
+		switchMeasureAfterSave: (state, { payload }) => {
+			state.newMeasureAfterSave = payload;
+		},
 	},
 });
 // 导出加减的方法
-export const { updateUser } = contextSlice.actions;
+export const { updateUser, switchMeasureAfterSave } = contextSlice.actions;
 
 // 默认导出
 export default contextSlice.reducer;