视频大小兼容

packages/base-components/VideoSliderModal/CHANGELOG.md

 # Change Log
 
-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
 ## [1.1.12](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.10...@wisdom-components/videoslidermodal@1.1.12) (2023-05-18)
 
-
 ### Bug Fixes
 
-* 萤石协议视频配置宽高/单个视频 ([8e582cf](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/8e582cf6118808c19f0b3800e769f4879e6e9f57))
-
-
-
-
-
+- 萤石协议视频配置宽高/单个视频 ([8e582cf](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/8e582cf6118808c19f0b3800e769f4879e6e9f57))
 
 ## [1.1.11](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.10...@wisdom-components/videoslidermodal@1.1.11) (2023-05-18)
 

packages/base-components/VmsVideo/CHANGELOG.md

 # Change Log
 
-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
 ## [1.2.8](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.7...@wisdom-components/VmsVideo@1.2.8) (2023-05-18)
 
 **Note:** Version bump only for package @wisdom-components/VmsVideo
 
-
-
-
-
-
 ## [1.2.7](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.6...@wisdom-components/VmsVideo@1.2.7) (2023-05-18)
 
 **Note:** Version bump only for package @wisdom-components/VmsVideo

packages/base-components/VmsVideo/src/index.jsx

@@ -2,7 +2,7 @@
  * @Author: 634665781 634665781@qq.com
  * @Date: 2023-04-11 13:40:18
  * @LastEditors: 634665781 634665781@qq.com
- * @LastEditTime: 2023-05-17 11:27:38
+ * @LastEditTime: 2023-05-18 14:47:06
  * @FilePath: \wisdom-components\packages\base-components\VmsVideo\src\index.jsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -18,7 +18,7 @@
 import EZUIKit, { log } from 'ezuikit-js';
 
 import axios from 'axios';
-import React, { useState, useRef, useEffect, useImperativeHandle, forwardRef } from 'react';
+import React, { useState, useRef, useEffect, useImperativeHandle, forwardRef,useLayoutEffect } from 'react';
 import App1 from './App';
 import style from './index.less';
 // import * as Jessibuca from './JessibucaVideo/jessibuca';
@@ -36,6 +36,9 @@ import style from './index.less';
 const Video = (props, ref) => {
   const _video = useRef(null);
   const Players = useRef(null);
+  const ref = useRef(null);
+  const [width, setWidth] = useState(0);
+  const [height, setHeight] = useState(0);
   let PlayersA = '';
   const { VideoInfo, JessibucaObj, gateway } = props;
   let baseUrl = `ws://${window.location.host}/jessica`;
@@ -47,7 +50,11 @@ const Video = (props, ref) => {
     fullUrl: '',
     key: `摄像头`,
   };
-
+  useLayoutEffect(() => {
+    console.log(ref.current.offsetWidth,ref.current.offsetHeight,'宽高');
+      setWidth(ref.current.offsetWidth);
+      setHeight(ref.current.offsetHeight);
+    }, []);
   const getToken = async () => {
     axios
       .post(
@@ -68,8 +75,8 @@ const Video = (props, ref) => {
           url: `ezopen://open.ys7.com/${VideoInfo.address}/${VideoInfo.channel || 1}.hd.live`,
           templete: 'simple',
           footer: ['talk', 'broadcast', 'hd', 'fullScreen'],
-          width: VideoInfo.width || 952,
-          height: VideoInfo.height || 500,
+         width: VideoInfo.width || width||952,
+        height: VideoInfo.height ||height||500,
         });
 
         PlayersA.pause = PlayersA.stop;
@@ -129,7 +136,7 @@ const Video = (props, ref) => {
   }, []);
 
   return (
-    <div className={style.app}>
+    <div ref={ref} className={style.app}>
       {VideoInfo.protocol == '萤石EZOPEN' ? (
         <div id={keyID}></div>
       ) : (