diff --git a/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx b/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx index b1cf4a6..f6eb9c1 100644 --- a/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx +++ b/src/pages/ElecEvaluation/Monitor/RoomDetail/index.tsx @@ -195,6 +195,10 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { const [recordWidthRef, setRecordWidthRef] = useState(1000); //进度条大小 const currentScaleRef = useRef(0); + //倍速 + const [speed, setSpeed] = useState(1); + //倍速序号 + const speedindexRef = useRef(0); const onCaremaPlay = (item: any) => { setCameraSelect(item.serialNumber); @@ -311,13 +315,12 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { setDeviceInfo(list[0]); deviceInfoRef.current = list[0]; setCameraSelect(list[0].serialNumber); - //setCameraParams(data[0].platform); - //onGetLiveStream(baseData,list[0]); - var i = 0; - playerRefList.current.forEach((element) => { - onGetLiveStream(baseData,list[i]?list[i]:null,element); - i++; - }); + onCaremaPlay(list[0]); + // var i = 0; + // playerRefList.current.forEach((element) => { + // onGetLiveStream(baseData,list[i]?list[i]:null,element); + // i++; + // }); } } @@ -341,7 +344,9 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { setTimeout(() => { player.play(options); if(basicInfoRef?.current.status == "2"){ + setTimeout(() => { jTimeLinePlayer(); + }, 1000); } }, 1000); @@ -430,6 +435,10 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { } const jTimeLinePlayer = () =>{ + + var container = document.getElementById("container0"); + setRecordWidthRef(container?.clientWidth); + //初始化回播组件 jTimeLineRef.current = new JTimeLine(); jTimeLineRef.current.init({ @@ -437,41 +446,26 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { onChange: handleTimeChange, }); - var container = document.getElementById("container0"); - console.log("-----------------") - console.log(container?.clientWidth) - setRecordWidthRef(container?.clientWidth); - jTimeLineRef.current.run({ time: parseInt(playerRefList.current[0].getCurTimestamp()) }); + changeTimer(); + } + const changeTimer = ()=> { if(timeLineTimerRef.current){ clearInterval(timeLineTimerRef.current); } timeLineTimerRef.current = setInterval(() => { jTimeLineRef.current.run({ time: parseInt(playerRefList.current[0].getCurTimestamp()) }); - - }, timerMsRef.current); + }, timerMsRef.current); } + const fullscreen = () => { playerRefList.current[0].fullscreen(); } const infoPlayer = () =>{ for(var i = 0 ; i < 1 ; i ++){ playerRefList.current[i] = new Player(document.getElementById("container"+i),null); - - - // playerRefList.current[i].event.on("GET_DEVICE_RECORD_LIST", (s) => { - // let recordList = s; - // console.log(s, "timelist"); - // //通过回调来传递时间轴数据 初始化时间轴 - // let recordArr = recordList.rec_file_infos; - // recordArr.forEach((item) => { - // item.startTime = dayjs(item.start_time).valueOf(); - // item.endTime = item.startTime + item.duration; - // }); - // jTimeLineArr.current = recordArr; - // }); } } @@ -500,6 +494,21 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { currentScaleRef.current < 3 && (++currentScaleRef.current, mathchDot(currentScaleRef.current)); } + const setSpeedFun = () =>{ + if (playerRefList.current[0].getState() == 2) return; + const arr = ["1", "2", "4", "8", "4", "2", "1", "1/2", "1/4", "1/8", "1/4", "1/2"]; + const arr2 = [1, 2, 4, 8, 4, 2, 1, 0.5, 0.25, 0.125, 0.25, 0.5]; + speedindexRef.current++; + if (speedindexRef.current == 12) { + speedindexRef.current=0; + } + setSpeed(arr[speedindexRef.current]); + + playerRefList.current[0].setSpeed(arr2[speedindexRef.current] + ""); + timerMsRef.current = 1000/arr2[speedindexRef.current]; + changeTimer(); + } + useEffect(() => { if(timeLineTimerRef.current){ clearInterval(timeLineTimerRef.current); @@ -615,9 +624,14 @@ const MonitorRoomDetail: React.FC<{}> = (props: any) => { onAdd()}>:""}
-
+
+ fullscreen()}>
+ +
+ +