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