优化测量页面步骤

.env

@@ -1 +1,2 @@
-REACT_APP_WS_URL=127.1.1.0:8080/ws
+REACT_APP_WS_URL=192.168.1.121:8080/ws
+# REACT_APP_WS_URL=127.1.1.0:8080/ws

package.json

@@ -2,7 +2,7 @@
   "name": "outline",
   "version": "0.1.0",
   "private": true,
-  "proxy": "http://127.1.1.0:8080",
+  "proxy": "http://192.168.1.121:8080",
   "dependencies": {
     "@ant-design/icons": "^6.0.0",
     "@babel/core": "^7.16.0",

src/pages/measure/components/MeasureAction.tsx

@@ -254,6 +254,7 @@ export default function MeasureAction() {
 			audio.pause()
 		})
 	}
+	 const [status, setStatus] = useState(0)
 	/** ----------------------- WebSocket 消息处理 ----------------------- **/
 	useEffect(() => {
 		// 处理任务状态消息
@@ -273,9 +274,25 @@ export default function MeasureAction() {
 			setStatusList(prev => {
 				const updated = [...prev];
 				switch (type) {
-					case "START_RECORD_LEFT":
+					case 'WAITING_FOR_RECORD_THE_1ST_SIDE':
+					setStatus(1);
+					break;
+					case 'WAITING_FOR_RECORD_THE_2ND_SIDE':
+					setStatus(2)
+					break;
+					case 'START_RECORD_SIG':
 						updated[0].color = STEP_COLOR_GREEN;
 						updated[1].color = STEP_COLOR_BLUE;
+					break;
+					case 'START_RECORD_LEFT':
+					case 'START_RECORD_RIGHT':
+					if (status === 1) {
+							updated[0].color = STEP_COLOR_GREEN;
+							updated[1].color = STEP_COLOR_BLUE;
+						} else if (status === 2) {
+							updated[3].color = STEP_COLOR_GREEN;
+							updated[4].color = STEP_COLOR_BLUE;
+						}
 						const audio1 = new Audio("/audio/measuring.mp3");
 						// 播放音频
 						audio1
@@ -287,58 +304,52 @@ export default function MeasureAction() {
 								console.error("播放音频时出错:", err);
 							});
 						setAudioList([...audioList, audio1])
-						break;
+					break;
 					case "FINISH_RECORD_LEFT":
+					case "FINISH_RECORD_RIGHT":
+						pauseAudio()
+						if (status === 1) {
+							updated[1].color = STEP_COLOR_GREEN;
+							updated[2].color = STEP_COLOR_GREEN;
+							updated[3].color = STEP_COLOR_BLUE;
+							const line1Audio = new Audio("/audio/side_end.mp3");
+							// 播放音频
+							line1Audio
+								.play()
+								.then(() => {
+									console.log("音频开始播放");
+								})
+								.catch(err => {
+									console.error("播放音频时出错:", err);
+								});
+							setAudioList([...audioList, line1Audio])
+						}else if(status === 2) {
+							updated[3].color = STEP_COLOR_GREEN;
+							updated[4].color = STEP_COLOR_BLUE;
+							const audio2 = new Audio("/audio/measure_end.mp3");
+							// 播放音频
+							audio2
+								.play()
+								.then(() => {
+									console.log("音频开始播放");
+								})
+								.catch(err => {
+									console.error("播放音频时出错:", err);
+								});
+							setAudioList([...audioList, audio2])
+							setMeasurementFinished(true);
+						}
 						updated[1].color = STEP_COLOR_GREEN;
 						updated[2].color = STEP_COLOR_GREEN;
 						updated[3].color = STEP_COLOR_BLUE;
 						isLeftFinished.current = true;
-						pauseAudio()
-						const audio2 = new Audio("/audio/side_end.mp3");
-						// 播放音频
-						audio2
-							.play()
-							.then(() => {
-								console.log("音频开始播放");
-							})
-							.catch(err => {
-								console.error("播放音频时出错:", err);
-							});
-						setAudioList([...audioList, audio2])
-						break;
-					case "START_RECORD_RIGHT":
-						updated[3].color = STEP_COLOR_GREEN;
-						updated[4].color = STEP_COLOR_BLUE;
-						pauseAudio()
-						const audio3 = new Audio("/audio/measuring.mp3");
-						// 播放音频
-						audio3
-							.play()
-							.then(() => {
-								console.log("音频开始播放");
-							})
-							.catch(err => {
-								console.error("播放音频时出错:", err);
-							});
-						setAudioList([...audioList, audio3])
-						break;
-					case "FINISH_RECORD_RIGHT":
-						updated[4].color = STEP_COLOR_GREEN;
-						updated[5].color = STEP_COLOR_GREEN;
-						setMeasurementFinished(true);
-						pauseAudio()
-						const audio4 = new Audio("/audio/side_end.mp3");//measure_end
-						// 播放音频
-						audio4
-							.play()
-							.then(() => {
-								console.log("音频开始播放");
-							})
-							.catch(err => {
-								console.error("播放音频时出错:", err);
-							});
+						
+						
 						break;
 					case "FINISH_RECORD":
+						updated.forEach(item => {
+							item.color = STEP_COLOR_GREEN
+						})
 						const audioFinish= new Audio("/audio/measure_end.mp3");//measure_end
 						// 播放音频
 						audioFinish
@@ -351,6 +362,7 @@ export default function MeasureAction() {
 							});
 							setCaLoading(true)
 							setLoadingText('正在处理测量数据...')
+							setMeasurementFinished(true);
 						break;
 					case "WRONG_SIDE":
 						const audio5 = new Audio("/audio/alert_left.mp3");

src/services/wsTypes.ts

@@ -12,7 +12,9 @@ export type TaskState = {
 		| "END_RECORD_SIG"
 		| "END_RECORD"
 		| "START_RECORD_RIGHT"
-		| "WRONG_SIDE";
+		| "WRONG_SIDE"
+		| "WAITING_FOR_RECORD_THE_1ST_SIDE"
+		| "WAITING_FOR_RECORD_THE_2ND_SIDE"
 	// data: {
 	// 	event: "START_RECORD_SIG" | "END_RECORD_SIG" | "FINISHED" | "START_RECORD_LEFT" | "FINISH_RECORD_RIGHT" | "FINISH_RECORD" | "FINISH_RECORD_LEFT" | "END_RECORD_SIG" | "END_RECORD" | "START_RECORD_RIGHT";
 	// };