ADD:弘基AI监控

.env.development

@@ -7,7 +7,9 @@ ENV = 'development'
 # 若依管理系统/开发环境
 VUE_APP_BASE_API = '/dev-api'
 
-VUE_APP_WS_URL = 'ws://192.168.2.16:8080'
+VUE_APP_WS_URL = 'ws://192.168.2.16:8081'
+VUE_APP_SRS_URL = 'http://192.168.168.20:2022'
+
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.production

@@ -6,5 +6,6 @@ ENV = 'production'
 
 # 若依管理系统/生产环境
 VUE_APP_BASE_API = '/prod-api'
-VUE_APP_WS_URL = 'ws://192.168.3.248:8081'
-VUE_APP_IFRAME_URL = 'http://192.168.3.248:5000/'
+VUE_APP_WS_URL = 'ws://192.168.168.20:8081'
+VUE_APP_SRS_URL = 'http://192.168.168.20:2022'
+

src/router/index.js

@@ -183,6 +183,7 @@ Router.prototype.replace = function push(location) {
 
 export default new Router({
   mode: 'history', // 去掉url中的#
+  // mode: 'hash',
   scrollBehavior: () => ({ y: 0 }),
   routes: constantRoutes
 })

src/views/AlgorithmConfig/index.vue

@@ -48,7 +48,7 @@
         @pagination="getList"
       />
     </div>
-    // 修改弹窗部分的模板
+
     <el-dialog
       title="修改等级"
       :visible.sync="editDialogVisible"

src/views/Screen/index.vue

@@ -209,7 +209,8 @@ export default {
       height: 0,
       resizeObserver: null,
       iframeSrc: "", // iframe的src
-      iframeUrl: process.env.VUE_APP_IFRAME_URL, // iframe的src
+      iframeUrl: process.env.VUE_APP_SRS_URL, // iframe的src
+      srsUrl: process.env.VUE_APP_SRS_URL, //SRS服务地址
     };
   },
   computed: {},
@@ -229,11 +230,7 @@ export default {
     this.init();
     this.getAlarmLog();
   },
-  mounted() {
-    this.$nextTick(() => {
-      this.videoPlayer();
-    });
-  },
+  mounted() {},
   beforeDestroy() {
     if (this.resizeObserver) {
       this.resizeObserver.disconnect();
@@ -244,6 +241,37 @@ export default {
     async init() {
       // 使用Promise.all等待所有请求完成
       await Promise.all([
+        getVideoPlayUrlWithAlgorithm().then((res) => {
+          if (res.code !== 200) return;
+
+          // 在数据转换时保留原始字段
+          this.videoList = res.rows.map((camera) => ({
+            value: camera.cameraId,
+            label: camera.cameraName, // 这里保持摄像头名称
+            children: [
+              // 原有算法列表
+              ...camera.algorithmVo.map((algorithm) => ({
+                value: algorithm.algorithmId,
+                label: algorithm.algorithmName,
+              })),
+            ],
+          }));
+          // 设置默认选中第一个摄像头的第一个算法
+          if (
+            this.videoList.length > 0 &&
+            this.videoList[0].children?.length > 0
+          ) {
+            this.selectVidoe = [
+              this.videoList[0].value,
+              this.videoList[0].children[0].value,
+            ];
+            this.cameraName = this.videoList[0].label; // 摄像头名称
+            this.algorithmName = this.videoList[0].children[0].label; // 算法名称
+            var url = `${this.srsUrl}/view/${this.videoList[0].value}_${this.videoList[0].children[0].value}.flv`;
+            this.videoPlayer(url);
+          }
+          this.videoShow = true;
+        }),
         getCameraList().then((res) => {
           if (res.code !== 200) return;
         }),
@@ -320,14 +348,17 @@ export default {
           }
         });
         this.iframeSrc = `${this.iframeUrl}/view/${value[0]}/${value[1]}`;
+        var url = `${this.srsUrl}/live/${value[0]}_${value[1]}.flv`;
+
+        this.videoPlayer(url);
       }
     },
-    videoPlayer() {
+    videoPlayer(url = "") {
       if (flvjs.isSupported()) {
         var videoElement = document.getElementById("videoPlayer");
         var flvPlayer = flvjs.createPlayer({
           type: "flv",
-          url: "http://192.168.3.248:2022/live/15_1_.flv", //你的url地址
+          url: url, //你的url地址
         });
         flvPlayer.attachMediaElement(videoElement);
         flvPlayer.load();

src/views/index.vue

@@ -227,7 +227,8 @@ export default {
       width: 0,
       height: 0,
       resizeObserver: null,
-      iframeUrl: process.env.VUE_APP_IFRAME_URL,
+      iframeUrl: process.env.VUE_APP_SRS_URL,
+      srsUrl: process.env.VUE_APP_SRS_URL,
       player: null,
       // 加载完成状态
       isLoaded: false,
@@ -250,11 +251,7 @@ export default {
     this.init();
     this.getAlarmLog();
   },
-  mounted() {
-    this.$nextTick(() => {
-      this.videoPlayer();
-    });
-  },
+  mounted() {},
   methods: {
     async init() {
       // 使用Promise.all等待所有请求完成
@@ -267,8 +264,6 @@ export default {
             value: camera.cameraId,
             label: camera.cameraName, // 这里保持摄像头名称
             children: [
-              // 新增预览选项
-              { value: "preview", label: "原始画面" },
               // 原有算法列表
               ...camera.algorithmVo.map((algorithm) => ({
                 value: algorithm.algorithmId,
@@ -287,7 +282,8 @@ export default {
             ];
             this.cameraName = this.videoList[0].label; // 摄像头名称
             this.algorithmName = this.videoList[0].children[0].label; // 算法名称
-            this.iframeSrc = `${this.iframeUrl}/view/${this.videoList[0].value}/${this.videoList[0].children[0].value}`;
+            var url = `${this.srsUrl}/view/${this.videoList[0].value}_${this.videoList[0].children[0].value}.flv`;
+            this.videoPlayer(url);
           }
           this.videoShow = true;
         }),
@@ -363,14 +359,16 @@ export default {
           }
         });
         this.iframeSrc = `${this.iframeUrl}/view/${value[0]}/${value[1]}`;
+        var url = `${this.srsUrl}/live/${value[0]}_${value[1]}.flv`;
+        this.videoPlayer(url);
       }
     },
-    videoPlayer() {
+    videoPlayer(url = "") {
       if (flvjs.isSupported()) {
         var videoElement = document.getElementById("videoPlayer");
         var flvPlayer = flvjs.createPlayer({
           type: "flv",
-          url: "http://192.168.1.84:2022/live/15_1_.flv", //你的url地址
+          url: url, //你的url地址
         });
         flvPlayer.attachMediaElement(videoElement);
         flvPlayer.load();

vue.config.js

@@ -40,7 +40,7 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://192.168.2.16:8080`,
+        target: `http://192.168.2.16:8081`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''