优化

.env

@@ -1 +1 @@
-REACT_APP_WS_URL=192.168.1.201:8080/ws
+REACT_APP_WS_URL=192.168.1.200:8080/ws

package.json

@@ -2,7 +2,7 @@
   "name": "outline",
   "version": "0.1.0",
   "private": true,
-  "proxy": "http://192.168.1.201:8080",
+  "proxy": "http://192.168.1.200:8080",
   "dependencies": {
     "@babel/core": "^7.16.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",

src/components/Header.tsx

@@ -13,18 +13,21 @@ import { useNavigate } from "react-router";
 import { useAppDispatch, useAppSelector } from "../utils/hooks";
 import { updateUser } from "../store/features/contextSlice";
 import "./bluetooth.scss";
-import { loginUser } from "../services/wsTypes";
 export default function Header() {
 	const navigate = useNavigate();
 	const dispatch = useAppDispatch();
 	const deviceInfo = useAppSelector(store => store.context.device);
 	const deviceState = useAppSelector(store => store.deviceState);
 	const userInfo = useAppSelector(store => store.context.user.loginUser);
-	let [isConnect, setIsConnect] = useState(true);
-	const [bluetoothInfo, setBluetoothInfo] = useState(deviceState);
+	let [isConnect, setIsConnect] = useState(deviceState.isConnect);
 
+	const [bluetoothInfo, setBluetoothInfo] = useState(deviceState);
+	useEffect(()=>{
+		setBluetoothInfo(deviceState)
+	},[deviceState])
 	//获取当前websocet的状态
 	const showBlueImg = () => {
+		console.log('deviceState---', deviceState)
 		if (isConnect) {
 			return (
 				<Popover content={getBtContent()} title="" trigger="click">
@@ -125,8 +128,9 @@ export default function Header() {
 
 	//设备已连接
 	const getBtContent = () => {
+		console.log('bluetoothInfo---22----', bluetoothInfo)
 		return (
-			<div>
+			<div key={bluetoothInfo.sn}>
 				<div>
 					<div className="bluetooth_c">
 						<img src={check_mark} alt="" className="ext-base ml-2 h-4" />

src/pages/measure/components/MeasureDetail.tsx

@@ -152,36 +152,37 @@ export default function MeasureDetail() {
 		});
 	}
 
-	const onShowDetail = (item:DetailTable)=> {
+	const onShowDetail = async (item:DetailTable)=> {
 		//获取基线
-		getBaseRecordPointSetByCode("6001").then(res => {
-			if (res.success) {
 		setIsModalOpen(true)
+		let res = await getBaseRecordPointSetByCode("6001")
+		if (res.success) {
 			const benchmarkShapes = JSON.parse(res.data.points) as BenchmarkShape[];
+			
 			setTimeout(()=>{
+				console.log('canvasRef.current---', canvasRef.current)
 				if (canvasRef.current) {
 					console.log("解析后的基础图形数据：", benchmarkShapes);
 					canvasRef.current.setBenchmarkData(benchmarkShapes);
 				}
-				},50)
+			},100)
 		}
-		});
-		getDetail({id:item.id}).then(res=>{
-			console.log('res==测量记录详情=', res)
-			if(res){
 		
+		let resData = await getDetail({id:item.id})
+		console.log('res==测量记录详情=', resData)
+		if(resData){
 			// navigate(`/measure/detail/${item.id}`)
 			//@ts-ignore
-				getRecordByUuid(res.data.uuid)
+			getRecordByUuid(resData.data.uuid)
 			//@ts-ignore
-				onDetaiResult(res.data.uuid)
+			onDetaiResult(resData.data.uuid)
 		}
-		})
 	}
 
 	//法线
 	const [analysisReport, setAnalysisReport] = useState<AnalysisReport>();
 	const onDetaiResult = (uuid:string) => {
+		
 		getReport(uuid,'6001').then(res=> {
 			if (res.success) {
 				const report: AnalysisReport = res.data;
@@ -191,18 +192,18 @@ export default function MeasureDetail() {
 					// 先过滤掉 distance 为 null 的数据
 					const validItems = report.angleAnalysisList.filter(item => item.distance !== null);
 					const analysisData: AnalysisData[] = validItems.map(item => ({
-									pointA: { x: parseFloat(item.pointA.x), y: parseFloat(item.pointA.y) },
-									pointB: { x: parseFloat(item.pointB.x), y: parseFloat(item.pointB.y) },
-									base: { x: parseFloat(item.pointA.x), y: parseFloat(item.pointA.y) },
-									measure: { x: parseFloat(item.pointB.x), y: parseFloat(item.pointB.y) },
+						pointA: { x: parseFloat(item.pointA ? item.pointA.x : '0'), y: parseFloat(item.pointA ? item.pointA.y : '0') },
+						pointB: { x: parseFloat(item.pointB ? item.pointB.x : '0'), y: parseFloat(item.pointB ? item.pointB.y : '0') },
+						base: { x: parseFloat(item.pointA ? item.pointA.x : '0'), y: parseFloat(item.pointA ? item.pointA.y : '0') },
+						measure: { x: parseFloat(item.pointB ? item.pointB.x : '0'), y: parseFloat(item.pointB ? item.pointB.y : '0') },
 						distance: parseFloat(item.distance),
 						describe: item.describe,
 					}));
 					
 					canvasRef.current?.setAnalysisData(analysisData);
 				}
-							console.log('report---', report)
 				setAnalysisReport(report);
+				
 			} else {
 				message.error("分析报告请求失败: " + res.data.info);
 			}
@@ -295,6 +296,11 @@ export default function MeasureDetail() {
 
 	}
 	const handleCancel = () => {
+		canvasRef.current?.setAnalysisData([]);
+		canvasRef.current?.setMeasurementData([]);
+		canvasRef.current?.setBenchmarkData([])
+		//@ts-ignore
+		setAnalysisReport({})
 		setIsModalOpen(false)
 	}
 	
@@ -329,7 +335,7 @@ export default function MeasureDetail() {
 					<Pagination  onChange={onPageChange} current={pageNum} pageSizeOptions={[5,10,20,30]} defaultCurrent={pageNum} defaultPageSize={pageSize} total={total}/>
 				</div>
 			</div>
-
+			{isModalOpen && 
 			<Modal 
 				title="测量记录详情" 
 				open={isModalOpen} 
@@ -337,6 +343,7 @@ export default function MeasureDetail() {
 				style={{ top: 20 }} 
 				closable={true}
 				onCancel={handleCancel}
+				key={String(isModalOpen)}
 				footer={[
 				<Button key="cancel" onClick={handleCancel}>
 					取消
@@ -418,7 +425,7 @@ export default function MeasureDetail() {
 													{analysisReport.railHeadWidth}
 												</td>
 											</tr>
-											{analysisReport.angleAnalysisList.map((item, index) => (
+											{analysisReport.angleAnalysisList && analysisReport.angleAnalysisList.map((item, index) => (
 												<tr key={index} style={{ height: "40px", fontSize: "18px", color: "#9E9E9E" }}>
 													<td style={{ padding: "8px", border: "1px solid #ccc" }}>{item.describe}</td>
 													<td style={{ padding: "8px", border: "1px solid #ccc" }}>{item.distance}</td>
@@ -432,6 +439,7 @@ export default function MeasureDetail() {
 					</div>
 					
       </Modal>
+			}
 		</div>
 	);
 }