fix 视频播放累计延迟+参数修改不生效

console/client/src/sections/console/containers/index.js

@@ -47,6 +47,7 @@ let lidarLiveWs;
 let dataLiveWsInterval;
 let lidarLiveWsInterval;
 let flvPlayerInterval;
+let jessibucasInterval;
 function Index (props) {
     const { dispatch, craneData } = props
     const xyCvs = useRef()
@@ -66,7 +67,18 @@ function Index (props) {
     const flvPlayer = useRef(null)
     const jessibucas = useRef(null)
 
-    const draw = (type, params = {}) => {
+    const draw = (
+        type,
+        params = {
+
+        },
+    ) => {
+
+        // params = {
+        //     from: 'lidarLive',
+        //     rotation: 78,
+        // }
+
         if (type == 'xz') {
             return
         }
@@ -110,11 +122,15 @@ function Index (props) {
             xyCtx.fill();
             xyCtx.stroke();
             // 吊臂 - 长~
+            let armLength = ((params.boom || radius) / radiusRate) * 2;
+            if (armLength <= (radius / 5)) {
+                armLength = radius / 5
+            }
             xyCtx.moveTo(...center);
             xyCtx.lineTo(
                 ...calculateIntersection(
                     ...center,
-                    ((params.boom || radius) / radiusRate) * 2, // 臂长
+                    armLength, // 臂长
                     curRotation
                 )
             );
@@ -563,7 +579,10 @@ function Index (props) {
 
             if (msg) {
                 // console.log(msg);
-                draw('xy', { ...msg, from: 'lidarLive' })
+                draw('xy', {
+                    ...msg,
+                    from: 'lidarLive',
+                })
             }
         }
 
@@ -576,39 +595,54 @@ function Index (props) {
                 try {
                     setVideo(res.payload.data)
                     const container = document.getElementById('video-play');
-                    console.log(`准备播放`);
+                    console.log(`准备播放`, res.payload.data.ws_flv);
                     // 播放方式 1
-                    const jessibuca = new window.Jessibuca({
-                        container: container,
-                        videoBuffer: 0.2, // 缓存时长
-                        isResize: false,
-                        text: "",
-                        loadingText: "加载中",
-                        debug: true,
-                        showBandwidth: false, // 显示网速
-                        showBandwidth: false,
-                        operateBtns: {
-                            fullscreen: false,
-                            screenshot: false,
-                            play: false,
-                            audio: false,
-
-                            fullscreen: true,
-                            screenshot: true,
-                            play: true,
-                            audio: true,
-                        },
-                        forceNoOffscreen: false,
-                        controlAutoHide: true,
-                        isNotMute: false,
-
-                        // useMSE:true,
-                        // autoWasm:true
-                    });
-                    jessibucas.current = jessibuca
-                    jessibuca.play(
-                        `${res.payload.data.ws_flv}`
-                    );
+                    const playJessibuca = () => {
+                        const jessibuca = new window.Jessibuca({
+                            container: container,
+                            videoBuffer: 0.2, // 缓存时长
+                            isResize: false,
+                            text: "",
+                            loadingText: "加载中",
+                            debug: true,
+                            showBandwidth: false, // 显示网速
+                            showBandwidth: false,
+                            operateBtns: {
+                                fullscreen: false,
+                                screenshot: false,
+                                play: false,
+                                audio: false,
+
+                                fullscreen: true,
+                                screenshot: true,
+                                play: true,
+                                audio: true,
+                            },
+                            forceNoOffscreen: false,
+                            controlAutoHide: true,
+                            isNotMute: false,
+
+                            // useMSE:true,
+                            // autoWasm:true
+                        });
+                        jessibucas.current = jessibuca
+                        jessibuca.play(
+                            // `http://flv.bdplay.nodemedia.cn/live/bbb.flv`
+                            // `ws://localhost:8081/jessica/34020000001320000001/34020000001320000001.flv`
+                            `${res.payload.data.ws_flv}`
+                        );
+                    }
+                    playJessibuca()
+
+                    jessibucasInterval = setInterval(() => {
+                        jessibucas.current.destroy()
+                        playJessibuca()
+                    },
+                        1000 * 60 * 30
+                        // 1000 * 10
+                    )
+
+
 
                     // 播放方式 2
                     // const flv = flvjs.createPlayer({
@@ -679,9 +713,12 @@ function Index (props) {
                 window.clearInterval(lidarLiveWsInterval);
                 lidarLiveWs.close();//关闭连接
             }
-            if(jessibucas.current){
+            if (jessibucas.current) {
                 jessibucas.current.destroy()
             }
+            if (jessibucasInterval.current) {
+                clearInterval(jessibucasInterval.current)
+            }
         }
     }, [])
 

console/client/src/sections/console/containers/setUp.js

@@ -16,6 +16,8 @@ function SetUp ({ dispatch, craneData }) {
     const [formItems, setFormItems] = useState([])
     const [formIndex, setFormIndex] = useState(0)
 
+    const craneDataRef = useRef(craneData)
+
     const [levelOneMenu] = useState([{
         n: '参数标定',
         ic: <BlockOutlined className='setup-icon' />,
@@ -202,17 +204,17 @@ function SetUp ({ dispatch, craneData }) {
         )
     }
 
-    const initData = () => {
-        console.log(craneData);
+    const initData = (craneData_) => {
         setTimeout(() => {
             form.setFieldsValue({
-                ...craneData
+                ...(craneData_ || craneDataRef.current || craneData)
             })
-        }, 0)
+        }, 300)
     }
 
     useEffect(() => {
-        initData()
+        craneDataRef.current = craneData
+        initData(craneData)
     }, [craneData])
 
     return (
@@ -250,10 +252,12 @@ function SetUp ({ dispatch, craneData }) {
                                                 key={index}
                                                 name={item.name}
                                                 label={item.label}
-                                            // rules={[{
-                                            //     // required: true,
-                                            //     // message: '请输入' + item.label
-                                            // }]}
+                                                // rules={[{
+                                                //     // required: true,
+                                                //     // message: '请输入' + item.label
+                                                // }]}
+
+                                                valuePropName={item.type == 'boolean' ? "checked" : undefined}
                                             >
                                                 {
                                                     item.type === 'number' ?