`fix`

ruoyi-ui-vue3/src/utils/websocket.ts

@@ -71,7 +71,6 @@ function initWebSocket(wsUrl: string) {
 
 // 定义重连函数
 let reConnect = (wsUrl: string) => {
-debugger
   console.log("尝试重新连接");
   if (useWSStore().isConnected()) return; // 如果已经连上就不在重连了
   rec && clearTimeout(rec);

ruoyi-ui-vue3/src/views/device/camera/index.vue

@@ -6,6 +6,10 @@
           <template #header>
             <div class="card-header">
               <span>视频设备</span>
+              <div>
+              <el-button v-if="isvideoshow" @click="isvideoshow=false">
+                  返回
+                </el-button></div>
             </div>
           </template>
           <div class="tree">
@@ -20,7 +24,12 @@
           </div>
         </el-card>
       </el-col>
-      <el-col :span="18">
+      <el-col :span="18"  v-if="isvideoshow">
+        <div style="height: 100%;">
+           <iframe id="FrameID" :key="currenturl" style="width: 100%;height:100%" :src="currenturl"/>
+        </div>
+      </el-col>
+      <el-col :span="18" v-if="!isvideoshow">
         <el-card class="box-card">
           <div style="display: flex; flex-direction: row; justify-content: space-between">
             <div>
@@ -114,12 +123,14 @@ import { listVideo, getVideo, delVideo, addVideo, updateVideo } from "@/api/data
 import { listVideoDetail, getVideoDetail, delVideoDetail, addVideoDetail, updateVideoDetail } from "@/api/data/videoDetail";
 import { ElMessage, ElMessageBox } from "element-plus";
 
-
+const isvideoshow = ref(false);
 const route = useRoute();
 const router = useRouter();
 
 const treeList = ref([])
 
+const currenturl = ref("");
+
 // const tableref = ref(null);
 
 const vidoeParams = ref({
@@ -135,13 +146,24 @@ const vidoeParams = ref({
     serialNumber: ''
 })
 
+
+
+
 const handleClick = (node) => {
   if (node.videoId != null) {
     searchform.value.id = node.videoId
   } else {
     searchform.value.id = node.id
   }
-  getVideoList();
+
+  currenturl.value = node.remark;
+  isvideoshow.value = true;
+
+
+
+
+
+
 };
 const selectedKey = ref(1);
 const data = ref([
@@ -221,6 +243,8 @@ const getVideoDetailList = () => {
     console.log(treeList.value);
     treeList.value.forEach(video => {
       video.children = [];
+      video["spread"] = true;
+      video["disabled"] = true;
       res.rows.forEach(detail => {
         if (video.id == detail.videoId) {
           detail.name = detail.cameraName
@@ -313,5 +337,13 @@ getVideoList();
   *:after {
     box-sizing: content-box !important;
   }
+
 }
+
+</style>
+
+<style lang="scss">
+.layui-disabled{
+    color: #000 !important;
+  }
 </style>

ruoyi-ui-vue3/src/views/device/camera/index2.vue

@@ -0,0 +1,130 @@
+<template>
+  <div style="width: 100%;height: 100%;">
+     <AMISRenderer :key="key" :formjson="rejson" ></AMISRenderer>
+
+  </div>
+
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+
+import AMISRenderer from '@/components/AMISRenderer';
+import { getUuid } from '@/utils/ruoyi';
+
+const key = ref("");
+const rejson = ref({});
+console.log("1111")
+
+
+onMounted(() => {
+  let json ={
+  "type": "page",
+  "body": [
+    {
+      "type": "grid",
+      "columns": [
+        {
+          "body": [
+            {
+              "type": "input-tree",
+              "label": "摄像头",
+              "name": "currenturl",
+              "options": [
+                {
+                  "label": "仿岩质潮间带生态修复工程",
+                  "value": "仿岩质潮间带生态修复工程",
+                  "children": [
+                    {
+                      "label": "水上摄像机",
+                      "value": "http://58.252.235.18:18080/#/play/wasm/ws%3A%2F%2F58.252.235.18%3A30500%2Frtp%2F44010200491320000091_44010200491320000091.live.flv"
+                    }
+                  ]
+                },
+                {
+                  "label": "红树林-盐沼生态海岸带生态修复工程",
+                  "value": "红树林-盐沼生态海岸带生态修复工程",
+                  "children": [
+                    {
+                      "label": "A1视频相机系统",
+                      "value": "http://58.252.235.18:18080/#/play/wasm/ws%3A%2F%2F58.252.235.18%3A30500%2Frtp%2F44010200491320000092_44010200491320000092.live.flv"
+                    },
+                    {
+                      "label": "A2视频相机系统",
+                      "value": "http://58.252.235.18:18080/#/play/wasm/ws%3A%2F%2F58.252.235.18%3A30500%2Frtp%2F44010200491320000113_44010200491320000113.live.flv"
+                    },
+                    {
+                      "label": "A3视频相机系统",
+                      "value": "http://58.252.235.18:18080/#/play/wasm/ws%3A%2F%2F58.252.235.18%3A30500%2Frtp%2F4101050000200000068_34020000001320000001.live.flv"
+                    }
+                  ]
+                }
+              ],
+              "id": "u:731363dc1d13",
+              "multiple": false,
+              "enableNodePath": false,
+              "hideRoot": true,
+              "showIcon": true,
+              "initiallyOpen": true,
+              "onlyLeaf": true,
+              "mode": "normal",
+              "treeContainerClassName": "",
+              "onEvent": {},
+              "clearable": false
+            }
+          ],
+          "id": "u:dde3e454bbd1",
+          "md": 3
+        },
+        {
+          "body": [
+            {
+              "type": "iframe",
+              "src": "${currenturl}",
+              "id": "u:82d542db2951"
+            }
+          ],
+          "id": "u:0dc7dced1be5"
+        }
+      ],
+      "id": "u:53098a4d112e",
+      "wrapperCustomStyle": {
+        "root": {
+          "height": "100%"
+        }
+      }
+    }
+  ],
+  "id": "u:3107a08edb40",
+  "asideResizor": false,
+  "pullRefresh": {
+    "disabled": true
+  },
+  "data": {
+    "currenturl": ""
+  },
+  "debug": true,
+  "regions": [
+    "body"
+  ],
+  "asideSticky": false,
+  "wrapperCustomStyle": {
+    "root": {
+      "width": "100%",
+      "height": "100%",
+      "min-height": "90vh"
+    }
+  }
+}
+  rejson.value = json;
+  key.value = getUuid();
+})
+
+</script>
+
+<style lang="scss" >
+.cxd-Page-content{
+  position: absolute !important;
+}
+
+</style>