视频播放修改

code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoOperationCloudControl.jsx

@@ -14,7 +14,7 @@ const VideoOperationCloudControl = ({
             gbptz(ac, videoObj, iotVideoServer)
         }
     }
-    const vcmpVideo = document.getElementById('vcmp_videoplay')?.offsetHeight;
+    const vcmpVideo = document.getElementsByClassName('vcmp_video'+videoObj.id)?.offsetHeight;
     console.log(vcmpVideo);
     return (
             <div style={{

code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoOperationHistroyTime.jsx

@@ -6,7 +6,7 @@ import moment from "moment";
 
 const timeFormat = 'YYYY-MM-DD HH:mm:ss'
 
-const VideoOperationHistroyTime = ({ close, histroyTime, setHistroyTime, setProcessDisX }) => {
+const VideoOperationHistroyTime = ({ close, histroyTime, setHistroyTime, setProcessDisX,videoObj }) => {
     const [selectedTimeRange, setSelectedTimeRange] = useState(histroyTime)
 
     useEffect(() => {
@@ -16,7 +16,7 @@ const VideoOperationHistroyTime = ({ close, histroyTime, setHistroyTime, setProc
     }, [])
 
     const ToastInCustomContainer = ToastFactory.create({
-        getPopupContainer: () => document.getElementById('vcmp_videoplay'),
+        getPopupContainer: () => document.getElementsByClassName('vcmp_video'+videoObj.id),
     });
 
     return (

code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoOperationTalk.jsx

@@ -15,7 +15,7 @@ const VideoOperationTalk = ({
     const [recordState, setRecordState] = useState(RecordState.NONE)
 
     const ToastInCustomContainer = ToastFactory.create({
-        getPopupContainer: () => document.getElementById('vcmp_videoplay'),
+        getPopupContainer: () => document.getElementsByClassName('vcmp_video'+videoObj.id),
     });
 
     useEffect(() => {
@@ -57,7 +57,7 @@ const VideoOperationTalk = ({
             }
         }
     }
-    const vcmpVideo = document.getElementById('vcmp_videoplay')?.offsetHeight;
+    const vcmpVideo = document.getElementsByClassName('vcmp_video'+videoObj.id)?.offsetHeight;
 
     return (
         <div style={{

code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoPlay.jsx

@@ -164,7 +164,7 @@ const VideoPlay = ({
       key: 'fullScreen',
       click: () => {
          changeSelectState('fullScreen')
-         let videoplay = document.getElementById('vcmp_videoplay')
+         let videoplay = document.getElementsByClassName('vcmp_video'+videoObj.id)
          if (screenfull.isEnabled) {
             screenfull.toggle(videoplay);
             if (videoObj?.type == 'yingshi' && player) {
@@ -209,7 +209,7 @@ const VideoPlay = ({
 
       // 全屏状态监听
       screenfull.on('change', (e) => {
-         if (e?.path[0]?.id=="vcmp_videoplay") {
+         if (e?.path[0]?.id=="vcmp_videoplay"+videoObj.id) {
             if (screenfull.isFullscreen && operationRef.current && !operationRef.current['fullScreen'].select) {
                changeSelectState('fullScreen')
             }
@@ -436,9 +436,8 @@ const VideoPlay = ({
 
    return (
       <>
-         <div className="vcmp_videoplay " style={{ width: size?.parentWidth || '100%', height: size?.parentHeight || '100%', backgroundColor: 'black', overflow: 'hidden', display: 'flex', alignItems: 'center', justifyContent: 'center', }}>
+         <div className={'vcmp_videoplay'+videoObj.id+" my_vcmp_videoplay"} style={{ width: size?.parentWidth || '100%', height: size?.parentHeight || '100%', backgroundColor: 'black', overflow: 'hidden', display: 'flex', alignItems: 'center', justifyContent: 'center', }}>
-            <div id="vcmp_videoplay" style={{ position: 'relative', height: size?.height || '100%', width: size?.width || '100%', minWidth: 240, minHeight: 135, overflow: 'hidden' }}>
+            <div id="vcmp_videoplay" className={'vcmp_video'+videoObj.id} style={{ position: 'relative', height: size?.height || '100%', width: size?.width || '100%', minWidth: 240, minHeight: 135, overflow: 'hidden' }}>              {/* 顶部信息 */}
-               {/* 顶部信息 */}
                <VideoHeader
                   operationState={operationState} changeSelectState={changeSelectState}
                   histroyTime={histroyTime}

code/VideoAccess-VCMP/web/client/src/components/videoPlayer/videoPlay.less

@@ -1,4 +1,4 @@
-.vcmp_videoplay {
+.my_vcmp_videoplay {
    .semi-datepicker {
       background-color: #fff;
    }

code/VideoAccess-VCMP/web/client/src/components/videoPlayer/voiceHeader.jsx

@@ -54,8 +54,8 @@ const VideoHeader = ({ operationState, changeSelectState, setProcessDisX, name,
         updateTime()
     }, [showTime])
 
-    const vcmp_videoplay = document.getElementById('vcmp_videoplay')?.clientHeight
+    const vcmp_videoplay = document.getElementsByClassName('vcmp_video'+videoObj.id)?.clientHeight
-    const vcmp_videopla = document.getElementById('vcmp_videoplay')?.clientWidth
+    const vcmp_videopla = document.getElementsByClassName('vcmp_video'+videoObj.id)?.clientWidth
 
     return (
         <div>

code/VideoAccess-VCMP/web/client/src/sections/openness/containers/mirroringDetail.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useRef } from 'react';
 import { connect } from 'react-redux';
 import '../style.less'
-import { Tree, Popconfirm, Typography, Input, Switch, Modal, Checkbox, CheckboxGroup, Select, Toast, Button } from "@douyinfe/semi-ui"
+import { Tree, Popconfirm, Typography, Input, Switch, Modal, Checkbox, CheckboxGroup, Select, Toast, Button, Notification } from "@douyinfe/semi-ui"
 import VideoScreen from '../components/videoScreen';
 import { set } from 'nprogress';
 
@@ -227,7 +227,13 @@ const MirroringDetail = (props) => {
                 filterGroup: filterGroup
             }
             dispatch(openness.putMirror(mirrordata)).then((res) => {
-                history.goBack()
+                if (res.success) {
+                    sethasModify(false)
+                    Notification.success({
+                        content: publish?'发布完成':'保存完成',
+                        duration: 3,
+                    })
+                }
             })
         }
     }
@@ -938,7 +944,7 @@ const MirroringDetail = (props) => {
                     {
                         editHeaderName ? (
                             <div style={{ fontSize: 16, color: '#FFFFFF', marginLeft: 20 }}>
-                                <Input value={headerName} onBlur={() => { setEditHeaderName(false) }} onChange={(value) => setHeaderName(value)} style={{ width: 200, color: 'rgba(255,255,255,0.9)', background: 'rgba(0,0,0,0.2)' }} maxLength={20} className='inputpadding'></Input>
+                                <Input value={headerName} onBlur={() => { setEditHeaderName(false) }} onChange={(value) => { setHeaderName(value); sethasModify(true) }} style={{ width: 200, color: 'rgba(255,255,255,0.9)', background: 'rgba(0,0,0,0.2)' }} maxLength={20} className='inputpadding'></Input>
                             </div>
                         ) : (
                             <div style={{ fontSize: 16, color: '#FFFFFF', marginLeft: 20 }}>
@@ -1144,7 +1150,7 @@ const MirroringDetail = (props) => {
                                                     <div style={{ marginLeft: 20, color: 'rgba(0,0,0,0.65)' }}>
                                                         {
                                                             editNum == item.num ? (
-                                                                <Input value={item.name} onBlur={() => { toChangeScreen(item.num, item.name) }} onChange={(value) => toEditscreen(value, index)} style={{ width: 120 }} maxLength={8} className='inputpadding' size='small'></Input>
+                                                                <Input value={item.name} onBlur={() => { toChangeScreen(item.num, item.name) }} onChange={(value) => { toEditscreen(value, index) }} style={{ width: 120 }} maxLength={8} className='inputpadding' size='small'></Input>
                                                             ) : (item.name)
                                                         }
                                                     </div>
@@ -1219,7 +1225,7 @@ const MirroringDetail = (props) => {
                                                     <div style={{ color: 'rgba(0,0,0,0.65)' }}>
                                                         {
                                                             labelEditNum == item.num ? (
-                                                                <Input value={item.name} onBlur={() => { toChangeLabel(item.num, item.name, addLabelNum) }} onChange={(value) => toEditLabel(value, index)} style={{ width: 120 }} maxLength={6} className='inputpadding' size='small'></Input>
+                                                                <Input value={item.name} onBlur={() => { toChangeLabel(item.num, item.name, addLabelNum) }} onChange={(value) => { toEditLabel(value, index) }} style={{ width: 120 }} maxLength={6} className='inputpadding' size='small'></Input>
                                                             ) : (item.name)
                                                         }
                                                     </div>