inl-ui 0.1.20 → 0.1.22

package/README.md

@@ -1,49 +1,49 @@
-# 工业PC ui库
-
-前端通用库，包括组件、hooks、utils等。
-
-### 运行
-
-+ 开发模式 yarn dev
-+ 生产打包 yarn build
-+ 生成文档 yarn build:docs
-+ 打包图扑工具 yarn buildtp
-
-### 使用方法
-
-```javascript
-import inl from 'inl-ui';
-import 'inl-ui/dist/style.css';
-
-vue.use(inl)
-```
-
-
-
-### 激活主题
-
-**vite.config.ts**
-
-```javascript
-const additionalData = require("inl-ui/dist/theme").default;
-
-...
-
-css: {
-  preprocessorOptions: {
-    less: {
-      javascriptEnabled: true,
-      additionalData,
-    },
-  },
-},
-```
-
-### 文档链接
-
-##### [组件文档](./src/components/README.md)
-
-##### [hooks文档](./src/hooks/README.md)
-
-##### [Utils文档](./src/utils/README.md)
-
+# 工业PC ui库
+
+前端通用库，包括组件、hooks、utils等。
+
+### 运行
+
++ 开发模式 yarn dev
++ 生产打包 yarn build
++ 生成文档 yarn build:docs
++ 打包图扑工具 yarn buildtp
+
+### 使用方法
+
+```javascript
+import inl from 'inl-ui';
+import 'inl-ui/dist/style.css';
+
+vue.use(inl)
+```
+
+
+
+### 激活主题
+
+**vite.config.ts**
+
+```javascript
+const additionalData = require("inl-ui/dist/theme").default;
+
+...
+
+css: {
+  preprocessorOptions: {
+    less: {
+      javascriptEnabled: true,
+      additionalData,
+    },
+  },
+},
+```
+
+### 文档链接
+
+##### [组件文档](./src/components/README.md)
+
+##### [hooks文档](./src/hooks/README.md)
+
+##### [Utils文档](./src/utils/README.md)
+

package/dist/components/index.cjs

@@ -13,6 +13,7 @@ var dayjs = require('dayjs');
 var qiankun = require('qiankun');
 require('vite-plugin-qiankun');
 var renderWithQiankun = require('vite-plugin-qiankun/dist/helper');
+var EZUIKit = require('ezuikit-js');
 var mobile = require('@sszj-temp/mobile');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -20,6 +21,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
 var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
 var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
+var EZUIKit__default = /*#__PURE__*/_interopDefaultLegacy(EZUIKit);
 
 const config = {
   prefix: "inl",
@@ -5068,7 +5070,7 @@ class WebRtcMt$1 {
       }
     }
   }
-  retryTime;
+  // protected retryTime;
   // 拉流创建播放器
   createVideo(plays) {
     this.mediaServerAddrMap.set(plays.videoElm, plays);
@@ -5079,7 +5081,6 @@ class WebRtcMt$1 {
       fetch(addRtspProxyUrl, {
         method: "GET"
       }).then(response => {
-        this.retryTime = 0;
         response.json().then(res => {
           if (res.code === 0) {
             this.startPlay(plays);
@@ -5091,12 +5092,9 @@ class WebRtcMt$1 {
           }
         });
       }).catch(err => {
-        if (!this.retryTime) {
-          this.retryTime = 60;
-          setTimeout(() => {
-            this.rePlay();
-          }, 60 * 1e3);
-        }
+        setTimeout(() => {
+          this.rePlay();
+        }, 3 * 60 * 1e3);
       });
     });
   }
@@ -5155,7 +5153,7 @@ class WebRtcMt$1 {
     this.stopPlay();
     setTimeout(() => {
       this.init(this.opt);
-    }, 1e3);
+    }, 5 * 1e3);
   }
   // 播放
   play(videoElm) {
@@ -7598,9 +7596,9 @@ const VideoPlayerV2 = vue.defineComponent({
     });
     vue.onBeforeUnmount(() => {
       stopPlay();
-      stopV(`videoPlayer_${uuid}`);
-      const videoElement = document.getElementById(uuid);
+      const videoElement = document.getElementById(`videoPlayer_${uuid}`);
       if (videoElement) {
+        videoElement.pause();
         videoElement.src = null;
         videoElement.srcObject = null;
         videoElement.remove();
@@ -8043,23 +8041,12 @@ const VideoBoxV2 = vue.defineComponent({
       camera.value = res.data.data;
       streams.value = JSON.parse(camera.value.brandTypePo?.streamTypeDict || "[]");
     };
-    let interval;
     let timeout;
     let show = vue.ref(true);
-    const timer = setInterval(() => {
-      show.value = false;
-      setTimeout(() => {
-        show.value = true;
-      }, 500);
-    }, _prop.intervalTime * (0.5 + Math.random()));
-    vue.onBeforeUnmount(() => {
-      clearInterval(interval);
-      clearInterval(timer);
-    });
+    vue.onBeforeUnmount(() => {});
     const fill = vue.ref("fill");
     vue.watch(() => _prop.camera, val => {
       if (val && Object.keys(val).length != 0) {
-        clearInterval(interval);
         getVideoParams(val);
         getVideoDetail(val);
         const fillVal = localStorage.getItem(val);
@@ -8665,6 +8652,60 @@ const AlarmVideo = vue.defineComponent({
 });
 var alarmVideo = installComponent(AlarmVideo, "alarm-video");
 
+const CloudVideo = vue.defineComponent({
+  props: {
+    // 视频信息|视频源uuid
+    cameraId: {
+      require: true,
+      type: String
+    },
+    channelNo: {
+      type: Number,
+      default: 1
+    },
+    // token
+    token: {
+      type: String,
+      default: ""
+    },
+    // template
+    template: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: [],
+  setup(prop, _context) {
+    const uuid = vue.ref(UUID());
+    const initVideo = async () => {
+      const res = await axios__default["default"].post("https://open.ys7.com/api/lapp/v2/live/address/get", void 0, {
+        params: {
+          accessToken: prop.token,
+          deviceSerial: prop.cameraId,
+          channelNo: prop.channelNo || 1
+        }
+      });
+      const parent = document.getElementById(`cloudVideo_${uuid.value}`)?.parentNode;
+      const opt = {
+        id: `cloudVideo_${uuid.value}`,
+        url: res.data.data.url,
+        accessToken: prop.token,
+        template: "pcLive",
+        height: parent?.clientHeight
+      };
+      new EZUIKit__default["default"].EZUIKitPlayer(opt);
+    };
+    vue.onMounted(() => {
+      initVideo();
+    });
+    return () => vue.createVNode("div", {
+      "id": `cloudVideo_${uuid.value}`,
+      "class": "cloudVideo"
+    }, null);
+  }
+});
+var cloudVideo = installComponent(CloudVideo, "cloud-video");
+
 const appName = "live";
 class WebRtcMt {
   constructor(opt) {
@@ -11247,6 +11288,7 @@ var index = installComponent(SszComment, "ssz-comment");
 exports.AlarmVideo = alarmVideo;
 exports.ChangeThemeSelect = index$6;
 exports.ChildLayout = childLayout;
+exports.CloudVideo = cloudVideo;
 exports.Demo = index$9;
 exports.FontSelect = index$1;
 exports.HeaderMenu = index$5;

package/dist/components/index.d.ts

@@ -3,7 +3,7 @@ import { PropType } from 'vue';
 import * as vue_jsx_runtime from 'vue/jsx-runtime';
 import * as _ant_design_icons_vue_lib_components_IconFont from '@ant-design/icons-vue/lib/components/IconFont';
 
-declare const _default$j: vue.DefineComponent<{
+declare const _default$k: vue.DefineComponent<{
     name: {
         type: StringConstructor;
         default: string;
@@ -17,7 +17,7 @@ declare const _default$j: vue.DefineComponent<{
     name: string;
 }, {}>;
 
-declare const _default$i: vue.FunctionalComponent<_ant_design_icons_vue_lib_components_IconFont.IconFontProps, {}, any>;
+declare const _default$j: vue.FunctionalComponent<_ant_design_icons_vue_lib_components_IconFont.IconFontProps, {}, any>;
 
 interface IMenuItem {
     id: string;
@@ -31,7 +31,7 @@ interface IMenuItem {
     subList: IMenuItem[];
 }
 type MenuList = IMenuItem[];
-declare const _default$h: vue.DefineComponent<{
+declare const _default$i: vue.DefineComponent<{
     userMenu: {
         type: PropType<MenuList>;
         required: true;
@@ -128,7 +128,7 @@ declare const _default$h: vue.DefineComponent<{
     showNotice: boolean;
 }, {}>;
 
-declare const _default$g: vue.DefineComponent<{
+declare const _default$h: vue.DefineComponent<{
     isClould: {
         default: boolean;
         type: BooleanConstructor;
@@ -190,7 +190,7 @@ declare const _default$g: vue.DefineComponent<{
     bg: string;
 }, {}>;
 
-declare const _default$f: vue.DefineComponent<Readonly<vue.ComponentPropsOptions<{
+declare const _default$g: vue.DefineComponent<Readonly<vue.ComponentPropsOptions<{
     [x: string]: unknown;
 }>>, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, never[], never, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<readonly string[] | vue.ExtractPropTypes<Readonly<vue.ComponentObjectPropsOptions<{
     [x: string]: unknown;
@@ -198,7 +198,7 @@ declare const _default$f: vue.DefineComponent<Readonly<vue.ComponentPropsOptions
     [x: number]: string;
 } | {}, {}>;
 
-declare const _default$e: vue.DefineComponent<{
+declare const _default$f: vue.DefineComponent<{
     withHeader: {
         type: BooleanConstructor;
         default: boolean;
@@ -269,9 +269,9 @@ declare const getDetailContainer: () => vue.DefineComponent<{
     unmountOnDeactived: boolean;
 }, {}>;
 
-declare const _default$d: vue.DefineComponent<{}, () => vue_jsx_runtime.JSX.Element, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
+declare const _default$e: vue.DefineComponent<{}, () => vue_jsx_runtime.JSX.Element, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
-declare const _default$c: vue.DefineComponent<{
+declare const _default$d: vue.DefineComponent<{
     teams: {
         type: {
             (arrayLength: number): any[];
@@ -338,7 +338,7 @@ declare const _default$c: vue.DefineComponent<{
     version: string;
 }, {}>;
 
-declare const _default$b: vue.DefineComponent<{
+declare const _default$c: vue.DefineComponent<{
     theme: {
         type: StringConstructor;
         default: string;
@@ -378,6 +378,46 @@ declare const _default$b: vue.DefineComponent<{
     countDown: number;
 }, {}>;
 
+declare const _default$b: vue.DefineComponent<{
+    cameraId: {
+        require: boolean;
+        type: StringConstructor;
+    };
+    channelNo: {
+        type: NumberConstructor;
+        default: number;
+    };
+    token: {
+        type: StringConstructor;
+        default: string;
+    };
+    template: {
+        type: StringConstructor;
+        default: string;
+    };
+}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, never[], never, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    cameraId: {
+        require: boolean;
+        type: StringConstructor;
+    };
+    channelNo: {
+        type: NumberConstructor;
+        default: number;
+    };
+    token: {
+        type: StringConstructor;
+        default: string;
+    };
+    template: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & {}, {
+    token: string;
+    template: string;
+    channelNo: number;
+}, {}>;
+
 interface videoInfo$1 {
     [key: string]: string | number | boolean | videoInfo$1 | Array<videoInfo$1>;
 }
@@ -1064,4 +1104,4 @@ declare const _default: vue.DefineComponent<{
     commentHeight: string;
 }, {}>;
 
-export { _default$b as AlarmVideo, _default$d as ChangeThemeSelect, _default$e as ChildLayout, _default$j as Demo, _default$1 as FontSelect, _default$6 as HeaderMenu, _default$i as IconFont, _default$5 as IconSelect, ImportModal, _default$h as Layout, _default$f as LayoutTable, _default$g as Login, _default$2 as ParamManager, ParamManagerV2, _default$3 as PeopleSelect, _default$c as PollingPlay, _default$4 as QueryFormContainer, _default as SszComment, _default$8 as VideoBox, _default$7 as VideoBoxV2, _default$9 as VideoPlayerV1, _default$a as VideoPlayerV2, getDetailContainer, getMenuDetail };
+export { _default$c as AlarmVideo, _default$e as ChangeThemeSelect, _default$f as ChildLayout, _default$b as CloudVideo, _default$k as Demo, _default$1 as FontSelect, _default$6 as HeaderMenu, _default$j as IconFont, _default$5 as IconSelect, ImportModal, _default$i as Layout, _default$g as LayoutTable, _default$h as Login, _default$2 as ParamManager, ParamManagerV2, _default$3 as PeopleSelect, _default$d as PollingPlay, _default$4 as QueryFormContainer, _default as SszComment, _default$8 as VideoBox, _default$7 as VideoBoxV2, _default$9 as VideoPlayerV1, _default$a as VideoPlayerV2, getDetailContainer, getMenuDetail };

package/dist/components/index.js

@@ -9,6 +9,7 @@ import dayjs from 'dayjs';
 import { loadMicroApp } from 'qiankun';
 import 'vite-plugin-qiankun';
 import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper';
+import EZUIKit from 'ezuikit-js';
 import { XPopup, CommentBlock, setAxiosOption } from '@sszj-temp/mobile';
 
 const config = {
@@ -5058,7 +5059,7 @@ class WebRtcMt$1 {
       }
     }
   }
-  retryTime;
+  // protected retryTime;
   // 拉流创建播放器
   createVideo(plays) {
     this.mediaServerAddrMap.set(plays.videoElm, plays);
@@ -5069,7 +5070,6 @@ class WebRtcMt$1 {
       fetch(addRtspProxyUrl, {
         method: "GET"
       }).then(response => {
-        this.retryTime = 0;
         response.json().then(res => {
           if (res.code === 0) {
             this.startPlay(plays);
@@ -5081,12 +5081,9 @@ class WebRtcMt$1 {
           }
         });
       }).catch(err => {
-        if (!this.retryTime) {
-          this.retryTime = 60;
-          setTimeout(() => {
-            this.rePlay();
-          }, 60 * 1e3);
-        }
+        setTimeout(() => {
+          this.rePlay();
+        }, 3 * 60 * 1e3);
       });
     });
   }
@@ -5145,7 +5142,7 @@ class WebRtcMt$1 {
     this.stopPlay();
     setTimeout(() => {
       this.init(this.opt);
-    }, 1e3);
+    }, 5 * 1e3);
   }
   // 播放
   play(videoElm) {
@@ -7588,9 +7585,9 @@ const VideoPlayerV2 = defineComponent({
     });
     onBeforeUnmount(() => {
       stopPlay();
-      stopV(`videoPlayer_${uuid}`);
-      const videoElement = document.getElementById(uuid);
+      const videoElement = document.getElementById(`videoPlayer_${uuid}`);
       if (videoElement) {
+        videoElement.pause();
         videoElement.src = null;
         videoElement.srcObject = null;
         videoElement.remove();
@@ -8033,23 +8030,12 @@ const VideoBoxV2 = defineComponent({
       camera.value = res.data.data;
       streams.value = JSON.parse(camera.value.brandTypePo?.streamTypeDict || "[]");
     };
-    let interval;
     let timeout;
     let show = ref(true);
-    const timer = setInterval(() => {
-      show.value = false;
-      setTimeout(() => {
-        show.value = true;
-      }, 500);
-    }, _prop.intervalTime * (0.5 + Math.random()));
-    onBeforeUnmount(() => {
-      clearInterval(interval);
-      clearInterval(timer);
-    });
+    onBeforeUnmount(() => {});
     const fill = ref("fill");
     watch(() => _prop.camera, val => {
       if (val && Object.keys(val).length != 0) {
-        clearInterval(interval);
         getVideoParams(val);
         getVideoDetail(val);
         const fillVal = localStorage.getItem(val);
@@ -8655,6 +8641,60 @@ const AlarmVideo = defineComponent({
 });
 var alarmVideo = installComponent(AlarmVideo, "alarm-video");
 
+const CloudVideo = defineComponent({
+  props: {
+    // 视频信息|视频源uuid
+    cameraId: {
+      require: true,
+      type: String
+    },
+    channelNo: {
+      type: Number,
+      default: 1
+    },
+    // token
+    token: {
+      type: String,
+      default: ""
+    },
+    // template
+    template: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: [],
+  setup(prop, _context) {
+    const uuid = ref(UUID());
+    const initVideo = async () => {
+      const res = await axios.post("https://open.ys7.com/api/lapp/v2/live/address/get", void 0, {
+        params: {
+          accessToken: prop.token,
+          deviceSerial: prop.cameraId,
+          channelNo: prop.channelNo || 1
+        }
+      });
+      const parent = document.getElementById(`cloudVideo_${uuid.value}`)?.parentNode;
+      const opt = {
+        id: `cloudVideo_${uuid.value}`,
+        url: res.data.data.url,
+        accessToken: prop.token,
+        template: "pcLive",
+        height: parent?.clientHeight
+      };
+      new EZUIKit.EZUIKitPlayer(opt);
+    };
+    onMounted(() => {
+      initVideo();
+    });
+    return () => createVNode("div", {
+      "id": `cloudVideo_${uuid.value}`,
+      "class": "cloudVideo"
+    }, null);
+  }
+});
+var cloudVideo = installComponent(CloudVideo, "cloud-video");
+
 const appName = "live";
 class WebRtcMt {
   constructor(opt) {
@@ -11234,4 +11274,4 @@ const SszComment = defineComponent({
 });
 var index = installComponent(SszComment, "ssz-comment");
 
-export { alarmVideo as AlarmVideo, index$6 as ChangeThemeSelect, childLayout as ChildLayout, index$9 as Demo, index$1 as FontSelect, index$5 as HeaderMenu, IconFont$1 as IconFont, icons as IconSelect, ImportModal, index$8 as Layout, table as LayoutTable, index$7 as Login, index$2 as ParamManager, ParamManagerV2, index$3 as PeopleSelect, pollingPlay as PollingPlay, index$4 as QueryFormContainer, index as SszComment, videoBox as VideoBox, VideoBoxV2$1 as VideoBoxV2, videoPlayerV1 as VideoPlayerV1, videoPlayerV2 as VideoPlayerV2, getDetailContainer, getMenuDetail };
+export { alarmVideo as AlarmVideo, index$6 as ChangeThemeSelect, childLayout as ChildLayout, cloudVideo as CloudVideo, index$9 as Demo, index$1 as FontSelect, index$5 as HeaderMenu, IconFont$1 as IconFont, icons as IconSelect, ImportModal, index$8 as Layout, table as LayoutTable, index$7 as Login, index$2 as ParamManager, ParamManagerV2, index$3 as PeopleSelect, pollingPlay as PollingPlay, index$4 as QueryFormContainer, index as SszComment, videoBox as VideoBox, VideoBoxV2$1 as VideoBoxV2, videoPlayerV1 as VideoPlayerV1, videoPlayerV2 as VideoPlayerV2, getDetailContainer, getMenuDetail };

package/dist/components/style.css

@@ -1,2 +1,3 @@
 .playVideos{display:flex;flex-direction:column;height:100%;padding-left:20px}.playVideos .operate{display:flex;justify-content:space-between;margin:5px 0}.playVideos .operate .button{cursor:pointer}.playVideos .grid{display:grid;flex:1;overflow:hidden}.playVideos .grid .video{background:#000;border:1px solid hsla(216,7%,59%,.3);height:100%;object-fit:fill;overflow:hidden;width:100%}.playVideos .grid.full{height:100%;left:0;position:fixed;top:0;width:100%;z-index:10}.playVideos .type1{grid-template-columns:1fr;grid-template-rows:1fr}.playVideos .type4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.playVideos .type8{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.playVideos .type8 .video:first-child{grid-column:1/4;grid-row:1/4}.playVideos .type9{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}.playVideos .type13{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.playVideos .type13 .video:first-child{grid-column:1/3;grid-row:1/3}.playVideos .type16{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}@keyframes moveBottom{0%{bottom:0}to{bottom:-66px}}.videoComponent{background:#000;height:100%;position:relative;width:100%}.videoComponent.fill{object-fit:fill}.videoComponent.contain{object-fit:contain}.videoBox{height:100%;overflow:hidden;position:relative}.videoBox.alarm:before{border:2px solid #ea5858;box-shadow:inset 0 0 10px 8px rgba(234,88,88,.5);content:"";height:100%;pointer-events:none;position:absolute;top:0;width:100%;z-index:7}.videoBox:hover .selectFields{animation-duration:1s;animation-fill-mode:both;animation-name:moveBottom}.videoBox:hover .footer-min{display:flex}.videoBox:hover .footer-min .name-min span,.videoBox:hover .footer-min .tool{display:block}.videoBox .selectFields{background:rgba(0,0,0,.3);bottom:0;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr;height:66px;position:absolute;width:100%}.videoBox .selectFields .info{border:0;color:#fff;line-height:33px;overflow:hidden;padding:0 5px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.videoBox .selectFields .info .value{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.videoBox .footer-min{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.04);border-radius:4px 4px 0 0;bottom:0;display:none;height:44px;justify-content:space-between;position:absolute;width:100%}.videoBox .footer-min .name-min{align-items:center;display:flex;padding-left:15px}.videoBox .footer-min .name-min span{color:#fff;display:none;font-size:16px;font-weight:600}.videoBox .footer-min .tool{display:none}.videoBox .footer-min .tool img{cursor:pointer;height:20px;margin-right:15px;width:20px}.videoControls{align-items:center;display:flex;flex-direction:column;width:100%}.videoControls .videoControl{height:126px;position:relative;width:126px}.videoControls .videoControl .bg{height:100%;position:relative;width:100%}.videoControls .videoControl img{cursor:pointer;position:absolute}.videoControls .videoControl .up{left:52px;top:14px}.videoControls .videoControl .lup{left:26px;top:26px;transform:rotate(-45deg)}.videoControls .videoControl .rup{left:78px;top:27px;transform:rotate(45deg)}.videoControls .videoControl .left{left:14px;top:52px;transform:rotate(-90deg)}.videoControls .videoControl .right{left:90px;top:52px;transform:rotate(90deg)}.videoControls .videoControl .ldown{left:26px;top:78px;transform:rotate(215deg)}.videoControls .videoControl .down{left:52px;top:90px;transform:rotate(180deg)}.videoControls .videoControl .rdown{left:78px;top:78px;transform:rotate(135deg)}.videoControls .btns{background:#e0e7f2;border-radius:19px;height:28px;margin:8px 8px 0;padding:3px;width:56px}.videoControls .btns img{cursor:pointer;margin-right:1px}
-.videoAlarmDia.dark{background:linear-gradient(90deg,#3e7eff,#1e4e75 30%,#1e4e75 70%,#3e7eff);padding:1px}.videoAlarmDia.dark .ant-modal-close{color:#fff}.videoAlarmDia.dark .ant-modal-header{background-color:#22396f;border-bottom-color:transparent;padding-left:20px}.videoAlarmDia.dark .ant-modal-header .ant-modal-title{align-items:center;background-image:linear-gradient(90deg,#2852a8 0,rgba(40,82,168,0) 50%);color:#fff;display:flex;height:42px;padding-left:10px}.videoAlarmDia.dark .ant-modal-content{background-color:#22396f}.videoAlarmDia.dark .ant-modal-content .body,.videoAlarmDia.dark .ant-modal-content .body .alarmList .alarm .name,.videoAlarmDia.dark .ant-modal-content .body .alarmList .title,.videoAlarmDia.dark .ant-modal-content .body .themeImg{color:#fff}.videoAlarmDia.dark .ant-modal-content .body .tabs .tabContainer .allTab .tab{background:#ffffff1a;color:#fff}.videoAlarmDia.dark .ant-modal-content .body .tabs .tabContainer .allTab .tab.active{background:#3e7eff;color:#fff}.videoAlarmDia .ant-modal-body{padding-top:18px}.videoAlarmDia .body{display:flex;flex-direction:column;height:660px}.videoAlarmDia .body .title{color:#000;font-size:18px}.videoAlarmDia .body .themeImg{height:18px;margin-right:5px;width:18px}.videoAlarmDia .body .current{align-self:center;display:flex;height:400px;justify-content:center;margin:10px 0 25px;width:750px}.videoAlarmDia .body .current .grid{grid-gap:3px;background-color:transparent;display:grid;height:100%;overflow:hidden;width:100%}.videoAlarmDia .body .current .grid .videoBox{background-color:#000}.videoAlarmDia .body .alarmList{display:flex;flex-wrap:wrap;justify-content:flex-start;max-height:80px;overflow:auto}.videoAlarmDia .body .alarmList .title{font-size:14px;font-weight:600;margin-bottom:10px}.videoAlarmDia .body .alarmList .alarm{align-items:center;border-radius:5px;color:#000;cursor:pointer;height:24px;margin-bottom:10px;margin-right:10px;padding:5px}.videoAlarmDia .body .alarmList .alarm img{height:16px;margin-right:5px;width:16px}.videoAlarmDia .body .alarmList .alarm .name{font-size:14px;white-space:nowrap}.videoAlarmDia .body .alarmList .alarm1{background:rgba(234,88,88,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm2{background:rgba(255,146,20,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm3{background:rgba(255,196,20,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm4{background:rgba(62,126,255,.1);color:#354052}.videoAlarmDia .body .tip{align-items:center;display:flex;margin:0}.videoAlarmDia .body .tip .sumNum{margin-right:16px}.videoAlarmDia .body .tip .timeNum{color:#3e7eff;font-weight:600;margin-right:5px}.videoAlarmDia .body .tabs{align-items:center;display:flex;margin:10px 0 5px}.videoAlarmDia .body .tabs .themeImg{cursor:pointer;overflow:visible}.videoAlarmDia .body .tabs .endIcon{margin-left:10px}.videoAlarmDia .body .tabs .tabContainer{display:flex;overflow:hidden}.videoAlarmDia .body .tabs .tabContainer .allTab{display:flex;height:40px;left:0;position:relative}.videoAlarmDia .body .tabs .tabContainer .allTab .tab{background:#f2f3f8;border-radius:4px;cursor:pointer;font-size:14px;height:32px;line-height:32px;margin-right:10px;padding:0 10px;position:relative;text-align:center;white-space:nowrap}.videoAlarmDia .body .tabs .tabContainer .allTab .tab.active{background:#1d33a2;color:#fff}.videoAlarmDia .body .tabs .tabContainer .allTab .tab.active:after{border:10px solid transparent;border-top-color:#1d33a2;content:"";height:0;left:50%;position:absolute;top:30px;width:0}.videoAlarmDia .body .numLine{align-items:center;display:flex}.videoAlarmDia .body .numLine .cameraNum{color:#3e7eff;font-weight:600}.videoAlarmDia .body .numLine .tipImg{height:18px;margin:0 5px 0 25px;width:18px}.videoAlarmDia .body .numLine .alarmNum{color:#fa4141;font-weight:600}.videoAlarmDia .body .otherAlarm{align-items:center;display:flex}.videoAlarmDia .body .otherAlarm .ant-tag{cursor:pointer;font-size:14px}.videoAlarmDia .body .otherAlarm .tipImg{height:18px;margin-right:5px;width:18px}.videoAlarmDia .body .otherAlarm .annotation{height:12px;margin:2px;width:12px}.videoAlarmDia .body .type1{grid-template-columns:1fr;grid-template-rows:1fr}.videoAlarmDia .body .type4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.videoAlarmDia .body .type8{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.videoAlarmDia .body .type8 .videoBox:first-child{grid-column:1/4;grid-row:1/4}.videoAlarmDia .body .type9{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}.videoAlarmDia .body .type13{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.videoAlarmDia .body .type13 .videoBox:first-child{grid-column:1/3;grid-row:1/3}.videoAlarmDia .body .type16{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}
+.videoAlarmDia.dark{background:linear-gradient(90deg,#3e7eff,#1e4e75 30%,#1e4e75 70%,#3e7eff);padding:1px}.videoAlarmDia.dark .ant-modal-close{color:#fff}.videoAlarmDia.dark .ant-modal-header{background-color:#22396f;border-bottom-color:transparent;padding-left:20px}.videoAlarmDia.dark .ant-modal-header .ant-modal-title{align-items:center;background-image:linear-gradient(90deg,#2852a8 0,rgba(40,82,168,0) 50%);color:#fff;display:flex;height:42px;padding-left:10px}.videoAlarmDia.dark .ant-modal-content{background-color:#22396f}.videoAlarmDia.dark .ant-modal-content .body,.videoAlarmDia.dark .ant-modal-content .body .alarmList .alarm .name,.videoAlarmDia.dark .ant-modal-content .body .alarmList .title,.videoAlarmDia.dark .ant-modal-content .body .themeImg{color:#fff}.videoAlarmDia.dark .ant-modal-content .body .tabs .tabContainer .allTab .tab{background:#ffffff1a;color:#fff}.videoAlarmDia.dark .ant-modal-content .body .tabs .tabContainer .allTab .tab.active{background:#3e7eff;color:#fff}.videoAlarmDia .ant-modal-body{padding-top:18px}.videoAlarmDia .body{display:flex;flex-direction:column;height:660px}.videoAlarmDia .body .title{color:#000;font-size:18px}.videoAlarmDia .body .themeImg{height:18px;margin-right:5px;width:18px}.videoAlarmDia .body .current{align-self:center;display:flex;height:400px;justify-content:center;margin:10px 0 25px;width:750px}.videoAlarmDia .body .current .grid{grid-gap:3px;background-color:transparent;display:grid;height:100%;overflow:hidden;width:100%}.videoAlarmDia .body .current .grid .videoBox{background-color:#000}.videoAlarmDia .body .alarmList{display:flex;flex-wrap:wrap;justify-content:flex-start;max-height:80px;overflow:auto}.videoAlarmDia .body .alarmList .title{font-size:14px;font-weight:600;margin-bottom:10px}.videoAlarmDia .body .alarmList .alarm{align-items:center;border-radius:5px;color:#000;cursor:pointer;height:24px;margin-bottom:10px;margin-right:10px;padding:5px}.videoAlarmDia .body .alarmList .alarm img{height:16px;margin-right:5px;width:16px}.videoAlarmDia .body .alarmList .alarm .name{font-size:14px;white-space:nowrap}.videoAlarmDia .body .alarmList .alarm1{background:rgba(234,88,88,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm2{background:rgba(255,146,20,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm3{background:rgba(255,196,20,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm4{background:rgba(62,126,255,.1);color:#354052}.videoAlarmDia .body .tip{align-items:center;display:flex;margin:0}.videoAlarmDia .body .tip .sumNum{margin-right:16px}.videoAlarmDia .body .tip .timeNum{color:#3e7eff;font-weight:600;margin-right:5px}.videoAlarmDia .body .tabs{align-items:center;display:flex;margin:10px 0 5px}.videoAlarmDia .body .tabs .themeImg{cursor:pointer;overflow:visible}.videoAlarmDia .body .tabs .endIcon{margin-left:10px}.videoAlarmDia .body .tabs .tabContainer{display:flex;overflow:hidden}.videoAlarmDia .body .tabs .tabContainer .allTab{display:flex;height:40px;left:0;position:relative}.videoAlarmDia .body .tabs .tabContainer .allTab .tab{background:#f2f3f8;border-radius:4px;cursor:pointer;font-size:14px;height:32px;line-height:32px;margin-right:10px;padding:0 10px;position:relative;text-align:center;white-space:nowrap}.videoAlarmDia .body .tabs .tabContainer .allTab .tab.active{background:#1d33a2;color:#fff}.videoAlarmDia .body .tabs .tabContainer .allTab .tab.active:after{border:10px solid transparent;border-top-color:#1d33a2;content:"";height:0;left:50%;position:absolute;top:30px;width:0}.videoAlarmDia .body .numLine{align-items:center;display:flex}.videoAlarmDia .body .numLine .cameraNum{color:#3e7eff;font-weight:600}.videoAlarmDia .body .numLine .tipImg{height:18px;margin:0 5px 0 25px;width:18px}.videoAlarmDia .body .numLine .alarmNum{color:#fa4141;font-weight:600}.videoAlarmDia .body .otherAlarm{align-items:center;display:flex}.videoAlarmDia .body .otherAlarm .ant-tag{cursor:pointer;font-size:14px}.videoAlarmDia .body .otherAlarm .tipImg{height:18px;margin-right:5px;width:18px}.videoAlarmDia .body .otherAlarm .annotation{height:12px;margin:2px;width:12px}.videoAlarmDia .body .type1{grid-template-columns:1fr;grid-template-rows:1fr}.videoAlarmDia .body .type4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.videoAlarmDia .body .type8{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.videoAlarmDia .body .type8 .videoBox:first-child{grid-column:1/4;grid-row:1/4}.videoAlarmDia .body .type9{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}.videoAlarmDia .body .type13{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.videoAlarmDia .body .type13 .videoBox:first-child{grid-column:1/3;grid-row:1/3}.videoAlarmDia .body .type16{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}
+.cloudVideo{height:100%}

package/dist/hooks/index.cjs

@@ -4773,7 +4773,7 @@ class WebRtcMt {
       }
     }
   }
-  retryTime;
+  // protected retryTime;
   // 拉流创建播放器
   createVideo(plays) {
     this.mediaServerAddrMap.set(plays.videoElm, plays);
@@ -4784,7 +4784,6 @@ class WebRtcMt {
       fetch(addRtspProxyUrl, {
         method: "GET"
       }).then(response => {
-        this.retryTime = 0;
         response.json().then(res => {
           if (res.code === 0) {
             this.startPlay(plays);
@@ -4796,12 +4795,9 @@ class WebRtcMt {
           }
         });
       }).catch(err => {
-        if (!this.retryTime) {
-          this.retryTime = 60;
-          setTimeout(() => {
-            this.rePlay();
-          }, 60 * 1e3);
-        }
+        setTimeout(() => {
+          this.rePlay();
+        }, 3 * 60 * 1e3);
       });
     });
   }
@@ -4860,7 +4856,7 @@ class WebRtcMt {
     this.stopPlay();
     setTimeout(() => {
       this.init(this.opt);
-    }, 1e3);
+    }, 5 * 1e3);
   }
   // 播放
   play(videoElm) {

package/dist/hooks/index.js

@@ -4764,7 +4764,7 @@ class WebRtcMt {
       }
     }
   }
-  retryTime;
+  // protected retryTime;
   // 拉流创建播放器
   createVideo(plays) {
     this.mediaServerAddrMap.set(plays.videoElm, plays);
@@ -4775,7 +4775,6 @@ class WebRtcMt {
       fetch(addRtspProxyUrl, {
         method: "GET"
       }).then(response => {
-        this.retryTime = 0;
         response.json().then(res => {
           if (res.code === 0) {
             this.startPlay(plays);
@@ -4787,12 +4786,9 @@ class WebRtcMt {
           }
         });
       }).catch(err => {
-        if (!this.retryTime) {
-          this.retryTime = 60;
-          setTimeout(() => {
-            this.rePlay();
-          }, 60 * 1e3);
-        }
+        setTimeout(() => {
+          this.rePlay();
+        }, 3 * 60 * 1e3);
       });
     });
   }
@@ -4851,7 +4847,7 @@ class WebRtcMt {
     this.stopPlay();
     setTimeout(() => {
       this.init(this.opt);
-    }, 1e3);
+    }, 5 * 1e3);
   }
   // 播放
   play(videoElm) {