diff --git a/src/api/MonitorAssetsOnMap.js b/src/api/MonitorAssetsOnMap.js
index 8795d6a..891804d 100644
--- a/src/api/MonitorAssetsOnMap.js
+++ b/src/api/MonitorAssetsOnMap.js
@@ -183,6 +183,16 @@
     params: query,
   });
 }
+
+// 视频单独的弹框菜单
+export function drainageDispatchGetMenuVidoe(query) {
+  return request({
+    url: `/business/drainageMap/getMenu`,
+    method: 'get',
+    params: query,
+  });
+}
+
 // 汇水分区查询关联7类数据  get  id
 export function getWaterRegionData(query) {
   return request({
@@ -380,4 +390,4 @@
     method: 'get',
     params: query,
   });
-}
\ No newline at end of file
+}

diff --git a/src/api/MonitorAssetsOnMap.js b/src/api/MonitorAssetsOnMap.js
index 8795d6a..891804d 100644
--- a/src/api/MonitorAssetsOnMap.js
+++ b/src/api/MonitorAssetsOnMap.js
@@ -183,6 +183,16 @@
     params: query,
   });
 }
+
+// 视频单独的弹框菜单
+export function drainageDispatchGetMenuVidoe(query) {
+  return request({
+    url: `/business/drainageMap/getMenu`,
+    method: 'get',
+    params: query,
+  });
+}
+
 // 汇水分区查询关联7类数据  get  id
 export function getWaterRegionData(query) {
   return request({
@@ -380,4 +390,4 @@
     method: 'get',
     params: query,
   });
-}
\ No newline at end of file
+}
diff --git a/src/views/pictureOnMap/index.vue b/src/views/pictureOnMap/index.vue
index 777aa13..cfbc3ac 100644
--- a/src/views/pictureOnMap/index.vue
+++ b/src/views/pictureOnMap/index.vue
@@ -47,7 +47,7 @@
 import bus from '@/bus';
 import useUserStore from '@/store/modules/user';
 import DialogTabs from '@/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue';
-import { drainageDispatchGetMenu } from '@/api/MonitorAssetsOnMap';
+import { drainageDispatchGetMenu, drainageDispatchGetMenuVidoe } from '@/api/MonitorAssetsOnMap';
 import recordPage from '@/views/voice/recordPage/index';
 import usepartitionStore from '@/store/modules/partition';
 
@@ -101,10 +101,6 @@
   'gateStation', //闸门
   'pump_water_level', //泵站液位
   'outlet_water_level_city', //排口流量
-
-  // 'gangqu_video', // 港渠视频、
-  // 'water_logging_video', // 渍水点视频
-  // 'pump_video', // 泵站视频
 ]);
 // 基本数据
 const arrid = ref([
@@ -263,6 +259,31 @@
   console.log('type', type);
   GetcomIDs.value = [];
   let dataId = '';
+
+  if (videoList.value.includes(type)) {
+    // 视频单独的获取菜单的
+    let params = {
+      dataCode: type,
+      scene: 'basis_monitor',
+    };
+    drainageDispatchGetMenuVidoe(params).then(res => {
+      console.log('获得的菜单', res.data);
+      Getmenuarr.value = res.data;
+      if (res.data && res.data.length) {
+        res.data.map(item => {
+          GetcomIDs.value.push(item.moduleName);
+        });
+      }
+
+      dialogConfig.visible = true;
+      dialogConfig.dataCode = type;
+      dialogConfig.dataID = Getproperties.value.stCode;
+      dialogConfig.comIDs = GetcomIDs.value;
+    });
+
+    return;
+  }
+
   if (arrstcode.value.includes(type)) {
     dataId = Getproperties.value.stCode;
   }
@@ -270,6 +291,7 @@
   if (arrid.value.includes(type)) {
     dataId = Getproperties.value.pid ? Getproperties.value.pid : Getproperties.value.id;
   }
+
   console.log('dataId', dataId);
   if (!dataId) {
     //渍水调度

diff --git a/src/api/MonitorAssetsOnMap.js b/src/api/MonitorAssetsOnMap.js
index 8795d6a..891804d 100644
--- a/src/api/MonitorAssetsOnMap.js
+++ b/src/api/MonitorAssetsOnMap.js
@@ -183,6 +183,16 @@
     params: query,
   });
 }
+
+// 视频单独的弹框菜单
+export function drainageDispatchGetMenuVidoe(query) {
+  return request({
+    url: `/business/drainageMap/getMenu`,
+    method: 'get',
+    params: query,
+  });
+}
+
 // 汇水分区查询关联7类数据  get  id
 export function getWaterRegionData(query) {
   return request({
@@ -380,4 +390,4 @@
     method: 'get',
     params: query,
   });
-}
\ No newline at end of file
+}
diff --git a/src/views/pictureOnMap/index.vue b/src/views/pictureOnMap/index.vue
index 777aa13..cfbc3ac 100644
--- a/src/views/pictureOnMap/index.vue
+++ b/src/views/pictureOnMap/index.vue
@@ -47,7 +47,7 @@
 import bus from '@/bus';
 import useUserStore from '@/store/modules/user';
 import DialogTabs from '@/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue';
-import { drainageDispatchGetMenu } from '@/api/MonitorAssetsOnMap';
+import { drainageDispatchGetMenu, drainageDispatchGetMenuVidoe } from '@/api/MonitorAssetsOnMap';
 import recordPage from '@/views/voice/recordPage/index';
 import usepartitionStore from '@/store/modules/partition';
 
@@ -101,10 +101,6 @@
   'gateStation', //闸门
   'pump_water_level', //泵站液位
   'outlet_water_level_city', //排口流量
-
-  // 'gangqu_video', // 港渠视频、
-  // 'water_logging_video', // 渍水点视频
-  // 'pump_video', // 泵站视频
 ]);
 // 基本数据
 const arrid = ref([
@@ -263,6 +259,31 @@
   console.log('type', type);
   GetcomIDs.value = [];
   let dataId = '';
+
+  if (videoList.value.includes(type)) {
+    // 视频单独的获取菜单的
+    let params = {
+      dataCode: type,
+      scene: 'basis_monitor',
+    };
+    drainageDispatchGetMenuVidoe(params).then(res => {
+      console.log('获得的菜单', res.data);
+      Getmenuarr.value = res.data;
+      if (res.data && res.data.length) {
+        res.data.map(item => {
+          GetcomIDs.value.push(item.moduleName);
+        });
+      }
+
+      dialogConfig.visible = true;
+      dialogConfig.dataCode = type;
+      dialogConfig.dataID = Getproperties.value.stCode;
+      dialogConfig.comIDs = GetcomIDs.value;
+    });
+
+    return;
+  }
+
   if (arrstcode.value.includes(type)) {
     dataId = Getproperties.value.stCode;
   }
@@ -270,6 +291,7 @@
   if (arrid.value.includes(type)) {
     dataId = Getproperties.value.pid ? Getproperties.value.pid : Getproperties.value.id;
   }
+
   console.log('dataId', dataId);
   if (!dataId) {
     //渍水调度
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
index f00b69a..acfd6af 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
@@ -60,20 +60,7 @@
   ],
 });
 const cameraName = ref('');
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
+const leftList = ref([]);
 
 // 左侧点击
 function leftclick(item) {
@@ -82,6 +69,7 @@
 
 // 获取监控视频列表
 function GetcameraList() {
+  console.log('props.videoList', props.videoList);
   // 如果是单独视频站点的类型 就没有多个 不用查询 直接赋值点击地图获取到的stcode
   if (props.videoList.includes(props.dataCode)) {
     AllData.cameraIndexCode = props.dataId;
@@ -114,8 +102,14 @@
 }
 
 onMounted(() => {
+  console.log('搞什么啊', props, props.dataId);
   GetcameraList();
-  console.log('props', props);
+});
+onBeforeUnmount(() => {
+  if (AllData.myVideoPlayer) {
+    hideDHPlayer();
+    AllData.myVideoPlayer.destroy();
+  }
 });
 </script>
 

diff --git a/src/api/MonitorAssetsOnMap.js b/src/api/MonitorAssetsOnMap.js
index 8795d6a..891804d 100644
--- a/src/api/MonitorAssetsOnMap.js
+++ b/src/api/MonitorAssetsOnMap.js
@@ -183,6 +183,16 @@
     params: query,
   });
 }
+
+// 视频单独的弹框菜单
+export function drainageDispatchGetMenuVidoe(query) {
+  return request({
+    url: `/business/drainageMap/getMenu`,
+    method: 'get',
+    params: query,
+  });
+}
+
 // 汇水分区查询关联7类数据  get  id
 export function getWaterRegionData(query) {
   return request({
@@ -380,4 +390,4 @@
     method: 'get',
     params: query,
   });
-}
\ No newline at end of file
+}
diff --git a/src/views/pictureOnMap/index.vue b/src/views/pictureOnMap/index.vue
index 777aa13..cfbc3ac 100644
--- a/src/views/pictureOnMap/index.vue
+++ b/src/views/pictureOnMap/index.vue
@@ -47,7 +47,7 @@
 import bus from '@/bus';
 import useUserStore from '@/store/modules/user';
 import DialogTabs from '@/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue';
-import { drainageDispatchGetMenu } from '@/api/MonitorAssetsOnMap';
+import { drainageDispatchGetMenu, drainageDispatchGetMenuVidoe } from '@/api/MonitorAssetsOnMap';
 import recordPage from '@/views/voice/recordPage/index';
 import usepartitionStore from '@/store/modules/partition';
 
@@ -101,10 +101,6 @@
   'gateStation', //闸门
   'pump_water_level', //泵站液位
   'outlet_water_level_city', //排口流量
-
-  // 'gangqu_video', // 港渠视频、
-  // 'water_logging_video', // 渍水点视频
-  // 'pump_video', // 泵站视频
 ]);
 // 基本数据
 const arrid = ref([
@@ -263,6 +259,31 @@
   console.log('type', type);
   GetcomIDs.value = [];
   let dataId = '';
+
+  if (videoList.value.includes(type)) {
+    // 视频单独的获取菜单的
+    let params = {
+      dataCode: type,
+      scene: 'basis_monitor',
+    };
+    drainageDispatchGetMenuVidoe(params).then(res => {
+      console.log('获得的菜单', res.data);
+      Getmenuarr.value = res.data;
+      if (res.data && res.data.length) {
+        res.data.map(item => {
+          GetcomIDs.value.push(item.moduleName);
+        });
+      }
+
+      dialogConfig.visible = true;
+      dialogConfig.dataCode = type;
+      dialogConfig.dataID = Getproperties.value.stCode;
+      dialogConfig.comIDs = GetcomIDs.value;
+    });
+
+    return;
+  }
+
   if (arrstcode.value.includes(type)) {
     dataId = Getproperties.value.stCode;
   }
@@ -270,6 +291,7 @@
   if (arrid.value.includes(type)) {
     dataId = Getproperties.value.pid ? Getproperties.value.pid : Getproperties.value.id;
   }
+
   console.log('dataId', dataId);
   if (!dataId) {
     //渍水调度
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
index f00b69a..acfd6af 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
@@ -60,20 +60,7 @@
   ],
 });
 const cameraName = ref('');
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
+const leftList = ref([]);
 
 // 左侧点击
 function leftclick(item) {
@@ -82,6 +69,7 @@
 
 // 获取监控视频列表
 function GetcameraList() {
+  console.log('props.videoList', props.videoList);
   // 如果是单独视频站点的类型 就没有多个 不用查询 直接赋值点击地图获取到的stcode
   if (props.videoList.includes(props.dataCode)) {
     AllData.cameraIndexCode = props.dataId;
@@ -114,8 +102,14 @@
 }
 
 onMounted(() => {
+  console.log('搞什么啊', props, props.dataId);
   GetcameraList();
-  console.log('props', props);
+});
+onBeforeUnmount(() => {
+  if (AllData.myVideoPlayer) {
+    hideDHPlayer();
+    AllData.myVideoPlayer.destroy();
+  }
 });
 </script>
 
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue
deleted file mode 100644
index 16f461f..0000000
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue
+++ /dev/null
@@ -1,168 +0,0 @@
-<template>
-  <div id="shipingjiankong">
-    <div class="leftbox">
-      <div
-        class="boxitem"
-        :class="item.cameraId == AllData.cameraIndexCode ? 'actived' : ''"
-        v-for="item in leftList"
-        :key="item"
-        :title="item.cameraName"
-        @click="leftclick(item)"
-      >
-        {{ item.cameraName }}
-      </div>
-    </div>
-    <div class="rightbox">
-      <!-- <HKVideo
-        ref="video"
-        :appkey="videoConfig.appKey"
-        :secret="videoConfig.appSecret"
-        :ip="videoConfig.ip"
-        :port="videoConfig.port"
-        :cameraIndexCode="AllData.cameraIndexCode"
-        :layout="AllData.layout"
-        :defaultList="AllData.defaultList"
-      ></HKVideo> -->
-      <videoDHone :channelId="AllData.cameraIndexCode"></videoDHone>
-    </div>
-  </div>
-</template>
-
-<script setup name="shipingjiankong">
-// import HKVideo from '@/components/videoHK/index.vue';
-import { HKconfig } from '@/utils/HKConfig';
-import { getdataCamera } from '@/api/MonitorAssetsOnMap';
-import videoDHone from '@/components/videoDHone/index.vue'; //实时视频
-
-const props = defineProps({
-  // 数据id
-  dataID: {
-    type: String,
-  },
-  dataCode: {
-    type: String,
-  },
-  // 默认打开tabs的key
-  RefreshName: {
-    type: String,
-  },
-  tabsType: {
-    type: String,
-  },
-  typeName: {
-    type: String,
-  },
-  arrstcode: {
-    type: Array,
-  },
-  arrid: {
-    type: Array,
-  },
-});
-
-const AllData = reactive({
-  cameraIndexCode: '0030845749854a8186d43306256112e7',
-  layout: '1x1',
-  defaultList: [
-    // { cameraIndexCode: "f8b48c890c054ac190c124bb190a7007", wndId: 7 },
-    // { cameraIndexCode: "09aa2a2694744cb8b188442b0b2af9b7", wndId: 6 },
-  ],
-});
-const cameraName = ref('');
-const videoConfig = reactive({
-  appKey: HKconfig.appkey,
-  appSecret: HKconfig.secret,
-  ip: HKconfig.ip,
-  port: HKconfig.port,
-});
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
-
-// 左侧点击
-function leftclick(item) {
-  AllData.cameraIndexCode = item.cameraId;
-}
-
-// 获取监控视频列表
-function GetcameraList() {
-  let params = {};
-  // 站点的参数
-  if (props.arrstcode.includes(props.dataCode)) {
-    params.stCode = props.dataID;
-    params.dataCode = 'site';
-  }
-
-  // 基础数据的参数
-  if (props.arrid.includes(props.dataCode)) {
-    params.dataId = props.dataID;
-    params.dataCode = props.dataCode;
-  }
-
-  let data = {
-    ...params,
-    cameraName: cameraName.value,
-  };
-  getdataCamera(data).then(res => {
-    console.log('res', res);
-    leftList.value = res.data;
-    // leftclick(res.data[0]);
-    AllData.cameraIndexCode = res.data[0].cameraId;
-  });
-}
-
-onMounted(() => {
-  GetcameraList();
-  console.log('props', props);
-});
-</script>
-
-<style lang="scss" scoped>
-#shipingjiankong {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  color: #ccefff;
-}
-
-.leftbox {
-  width: 200px;
-  padding: 0 5px;
-
-  .boxitem {
-    cursor: pointer;
-    width: 100%;
-    text-align: center;
-    padding: 5px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    /* 超出部分省略号 */
-    word-break: break-all;
-    /* break-all(允许在单词内换行。) */
-    display: -webkit-box;
-    /* 对象作为伸缩盒子模型显示 */
-    -webkit-box-orient: vertical;
-    /* 设置或检索伸缩盒对象的子元素的排列方式 */
-    -webkit-line-clamp: 1;
-
-    &.actived {
-      color: #1fa9f6;
-      border: 1px solid #1fa9f6;
-    }
-  }
-}
-.rightbox {
-  width: calc(100% - 200px);
-}
-</style>

diff --git a/src/api/MonitorAssetsOnMap.js b/src/api/MonitorAssetsOnMap.js
index 8795d6a..891804d 100644
--- a/src/api/MonitorAssetsOnMap.js
+++ b/src/api/MonitorAssetsOnMap.js
@@ -183,6 +183,16 @@
     params: query,
   });
 }
+
+// 视频单独的弹框菜单
+export function drainageDispatchGetMenuVidoe(query) {
+  return request({
+    url: `/business/drainageMap/getMenu`,
+    method: 'get',
+    params: query,
+  });
+}
+
 // 汇水分区查询关联7类数据  get  id
 export function getWaterRegionData(query) {
   return request({
@@ -380,4 +390,4 @@
     method: 'get',
     params: query,
   });
-}
\ No newline at end of file
+}
diff --git a/src/views/pictureOnMap/index.vue b/src/views/pictureOnMap/index.vue
index 777aa13..cfbc3ac 100644
--- a/src/views/pictureOnMap/index.vue
+++ b/src/views/pictureOnMap/index.vue
@@ -47,7 +47,7 @@
 import bus from '@/bus';
 import useUserStore from '@/store/modules/user';
 import DialogTabs from '@/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue';
-import { drainageDispatchGetMenu } from '@/api/MonitorAssetsOnMap';
+import { drainageDispatchGetMenu, drainageDispatchGetMenuVidoe } from '@/api/MonitorAssetsOnMap';
 import recordPage from '@/views/voice/recordPage/index';
 import usepartitionStore from '@/store/modules/partition';
 
@@ -101,10 +101,6 @@
   'gateStation', //闸门
   'pump_water_level', //泵站液位
   'outlet_water_level_city', //排口流量
-
-  // 'gangqu_video', // 港渠视频、
-  // 'water_logging_video', // 渍水点视频
-  // 'pump_video', // 泵站视频
 ]);
 // 基本数据
 const arrid = ref([
@@ -263,6 +259,31 @@
   console.log('type', type);
   GetcomIDs.value = [];
   let dataId = '';
+
+  if (videoList.value.includes(type)) {
+    // 视频单独的获取菜单的
+    let params = {
+      dataCode: type,
+      scene: 'basis_monitor',
+    };
+    drainageDispatchGetMenuVidoe(params).then(res => {
+      console.log('获得的菜单', res.data);
+      Getmenuarr.value = res.data;
+      if (res.data && res.data.length) {
+        res.data.map(item => {
+          GetcomIDs.value.push(item.moduleName);
+        });
+      }
+
+      dialogConfig.visible = true;
+      dialogConfig.dataCode = type;
+      dialogConfig.dataID = Getproperties.value.stCode;
+      dialogConfig.comIDs = GetcomIDs.value;
+    });
+
+    return;
+  }
+
   if (arrstcode.value.includes(type)) {
     dataId = Getproperties.value.stCode;
   }
@@ -270,6 +291,7 @@
   if (arrid.value.includes(type)) {
     dataId = Getproperties.value.pid ? Getproperties.value.pid : Getproperties.value.id;
   }
+
   console.log('dataId', dataId);
   if (!dataId) {
     //渍水调度
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
index f00b69a..acfd6af 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
@@ -60,20 +60,7 @@
   ],
 });
 const cameraName = ref('');
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
+const leftList = ref([]);
 
 // 左侧点击
 function leftclick(item) {
@@ -82,6 +69,7 @@
 
 // 获取监控视频列表
 function GetcameraList() {
+  console.log('props.videoList', props.videoList);
   // 如果是单独视频站点的类型 就没有多个 不用查询 直接赋值点击地图获取到的stcode
   if (props.videoList.includes(props.dataCode)) {
     AllData.cameraIndexCode = props.dataId;
@@ -114,8 +102,14 @@
 }
 
 onMounted(() => {
+  console.log('搞什么啊', props, props.dataId);
   GetcameraList();
-  console.log('props', props);
+});
+onBeforeUnmount(() => {
+  if (AllData.myVideoPlayer) {
+    hideDHPlayer();
+    AllData.myVideoPlayer.destroy();
+  }
 });
 </script>
 
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue
deleted file mode 100644
index 16f461f..0000000
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue
+++ /dev/null
@@ -1,168 +0,0 @@
-<template>
-  <div id="shipingjiankong">
-    <div class="leftbox">
-      <div
-        class="boxitem"
-        :class="item.cameraId == AllData.cameraIndexCode ? 'actived' : ''"
-        v-for="item in leftList"
-        :key="item"
-        :title="item.cameraName"
-        @click="leftclick(item)"
-      >
-        {{ item.cameraName }}
-      </div>
-    </div>
-    <div class="rightbox">
-      <!-- <HKVideo
-        ref="video"
-        :appkey="videoConfig.appKey"
-        :secret="videoConfig.appSecret"
-        :ip="videoConfig.ip"
-        :port="videoConfig.port"
-        :cameraIndexCode="AllData.cameraIndexCode"
-        :layout="AllData.layout"
-        :defaultList="AllData.defaultList"
-      ></HKVideo> -->
-      <videoDHone :channelId="AllData.cameraIndexCode"></videoDHone>
-    </div>
-  </div>
-</template>
-
-<script setup name="shipingjiankong">
-// import HKVideo from '@/components/videoHK/index.vue';
-import { HKconfig } from '@/utils/HKConfig';
-import { getdataCamera } from '@/api/MonitorAssetsOnMap';
-import videoDHone from '@/components/videoDHone/index.vue'; //实时视频
-
-const props = defineProps({
-  // 数据id
-  dataID: {
-    type: String,
-  },
-  dataCode: {
-    type: String,
-  },
-  // 默认打开tabs的key
-  RefreshName: {
-    type: String,
-  },
-  tabsType: {
-    type: String,
-  },
-  typeName: {
-    type: String,
-  },
-  arrstcode: {
-    type: Array,
-  },
-  arrid: {
-    type: Array,
-  },
-});
-
-const AllData = reactive({
-  cameraIndexCode: '0030845749854a8186d43306256112e7',
-  layout: '1x1',
-  defaultList: [
-    // { cameraIndexCode: "f8b48c890c054ac190c124bb190a7007", wndId: 7 },
-    // { cameraIndexCode: "09aa2a2694744cb8b188442b0b2af9b7", wndId: 6 },
-  ],
-});
-const cameraName = ref('');
-const videoConfig = reactive({
-  appKey: HKconfig.appkey,
-  appSecret: HKconfig.secret,
-  ip: HKconfig.ip,
-  port: HKconfig.port,
-});
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
-
-// 左侧点击
-function leftclick(item) {
-  AllData.cameraIndexCode = item.cameraId;
-}
-
-// 获取监控视频列表
-function GetcameraList() {
-  let params = {};
-  // 站点的参数
-  if (props.arrstcode.includes(props.dataCode)) {
-    params.stCode = props.dataID;
-    params.dataCode = 'site';
-  }
-
-  // 基础数据的参数
-  if (props.arrid.includes(props.dataCode)) {
-    params.dataId = props.dataID;
-    params.dataCode = props.dataCode;
-  }
-
-  let data = {
-    ...params,
-    cameraName: cameraName.value,
-  };
-  getdataCamera(data).then(res => {
-    console.log('res', res);
-    leftList.value = res.data;
-    // leftclick(res.data[0]);
-    AllData.cameraIndexCode = res.data[0].cameraId;
-  });
-}
-
-onMounted(() => {
-  GetcameraList();
-  console.log('props', props);
-});
-</script>
-
-<style lang="scss" scoped>
-#shipingjiankong {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  color: #ccefff;
-}
-
-.leftbox {
-  width: 200px;
-  padding: 0 5px;
-
-  .boxitem {
-    cursor: pointer;
-    width: 100%;
-    text-align: center;
-    padding: 5px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    /* 超出部分省略号 */
-    word-break: break-all;
-    /* break-all(允许在单词内换行。) */
-    display: -webkit-box;
-    /* 对象作为伸缩盒子模型显示 */
-    -webkit-box-orient: vertical;
-    /* 设置或检索伸缩盒对象的子元素的排列方式 */
-    -webkit-line-clamp: 1;
-
-    &.actived {
-      color: #1fa9f6;
-      border: 1px solid #1fa9f6;
-    }
-  }
-}
-.rightbox {
-  width: calc(100% - 200px);
-}
-</style>
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue b/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue
index 7396b2a..c8ef81e 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue
@@ -5,17 +5,8 @@
       <div class="closeIcon" @click="closeFun"></div>
     </div>
     <div class="contentBox flex-1">
-      <el-tabs
-        v-model="AllData.editableTabsValue"
-        :stretch="true"
-        @tab-click="TabsChange"
-      >
-        <el-tab-pane
-          v-for="item in AllData.editableTabs"
-          :key="item.name"
-          :label="item.title"
-          :name="item.name"
-        >
+      <el-tabs v-model="AllData.editableTabsValue" :stretch="true" @tab-click="TabsChange">
+        <el-tab-pane v-for="item in AllData.editableTabs" :key="item.name" :label="item.title" :name="item.name">
           <component
             :is="item.content"
             :dataID="dataID"
@@ -28,6 +19,7 @@
             v-if="AllData.RefreshName == item.name"
             :arrstcode="arrstcode"
             :arrid="arrid"
+            :videoList="videoList"
             :Getproperties="Getproperties"
           ></component>
         </el-tab-pane>
@@ -37,9 +29,9 @@
 </template>
 
 <script setup name="NewdialogTabs">
-import { ref, reactive, toRefs, onMounted } from "vue";
-const emit = defineEmits(["closeFun"]);
-import Config from "./DialogConfig";
+import { ref, reactive, toRefs, onMounted } from 'vue';
+const emit = defineEmits(['closeFun']);
+import Config from './DialogConfig';
 // 父元素传值
 // debugger;
 const props = defineProps({
@@ -80,16 +72,19 @@
   Getmenuarr: {
     type: Array,
   },
+  videoList: {
+    type: Array,
+  },
 });
 
 // 声明本页面中的变量
 const AllData = reactive({
-  editableTabsValue: "",
+  editableTabsValue: '',
   editableTabs: [],
-  RefreshName: "",
+  RefreshName: '',
 });
 
-const updateTabsType = (name) => {
+const updateTabsType = name => {
   AllData.editableTabsValue = name;
   AllData.RefreshName = name;
 };
@@ -99,16 +94,17 @@
   // console.log(tab, AllData.RefreshName);
 };
 const closeFun = () => {
-  emit("closeFun", false);
+  emit('closeFun', false);
 };
 onMounted(() => {
+  console.log('搞什么啊', props);
   // 获取当前组件已分配的组件ID与配置文件中的公共组件ID进行对比,控制展示的tab选项
   let ComparisonTable = Config.ComparisonTable;
   AllData.editableTabs = [];
   Promise.all(
     ComparisonTable.map(function (element) {
       // 动态修改后台返回的组件名称
-      props.Getmenuarr.map((item) => {
+      props.Getmenuarr.map(item => {
         if (item.moduleName == element.name) {
           element.title = item.menuName;
           element.show = item.show;
@@ -120,13 +116,13 @@
       }
     })
   ).then(function (data) {
-    data = data.filter((n) => n);
+    data = data.filter(n => n);
     //赋值其拥有的公共组件
     AllData.editableTabs = AllData.editableTabs.concat(data);
-    console.log(AllData.editableTabs, "公共组件");
+    console.log(AllData.editableTabs, '公共组件');
     //对自定义组件进行插入
-    props.customComponents.forEach((element) => {
-      if (element.sort && element.sort != "") {
+    props.customComponents.forEach(element => {
+      if (element.sort && element.sort != '') {
         // 如果有排序,就按照排序顺序插入到editableTabs中
         AllData.editableTabs.splice(element.sort, 0, element);
       } else if (element.sort == 0) {
@@ -137,11 +133,7 @@
         AllData.editableTabs.push(element);
       }
     });
-    if (
-      props.RefName == "" ||
-      props.RefName == undefined ||
-      !props.comIDs.includes(props.RefName)
-    ) {
+    if (props.RefName == '' || props.RefName == undefined || !props.comIDs.includes(props.RefName)) {
       // 默认展示第一个
       AllData.editableTabsValue = AllData.editableTabs[0].name;
       AllData.RefreshName = AllData.editableTabs[0].name;

diff --git a/src/api/MonitorAssetsOnMap.js b/src/api/MonitorAssetsOnMap.js
index 8795d6a..891804d 100644
--- a/src/api/MonitorAssetsOnMap.js
+++ b/src/api/MonitorAssetsOnMap.js
@@ -183,6 +183,16 @@
     params: query,
   });
 }
+
+// 视频单独的弹框菜单
+export function drainageDispatchGetMenuVidoe(query) {
+  return request({
+    url: `/business/drainageMap/getMenu`,
+    method: 'get',
+    params: query,
+  });
+}
+
 // 汇水分区查询关联7类数据  get  id
 export function getWaterRegionData(query) {
   return request({
@@ -380,4 +390,4 @@
     method: 'get',
     params: query,
   });
-}
\ No newline at end of file
+}
diff --git a/src/views/pictureOnMap/index.vue b/src/views/pictureOnMap/index.vue
index 777aa13..cfbc3ac 100644
--- a/src/views/pictureOnMap/index.vue
+++ b/src/views/pictureOnMap/index.vue
@@ -47,7 +47,7 @@
 import bus from '@/bus';
 import useUserStore from '@/store/modules/user';
 import DialogTabs from '@/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue';
-import { drainageDispatchGetMenu } from '@/api/MonitorAssetsOnMap';
+import { drainageDispatchGetMenu, drainageDispatchGetMenuVidoe } from '@/api/MonitorAssetsOnMap';
 import recordPage from '@/views/voice/recordPage/index';
 import usepartitionStore from '@/store/modules/partition';
 
@@ -101,10 +101,6 @@
   'gateStation', //闸门
   'pump_water_level', //泵站液位
   'outlet_water_level_city', //排口流量
-
-  // 'gangqu_video', // 港渠视频、
-  // 'water_logging_video', // 渍水点视频
-  // 'pump_video', // 泵站视频
 ]);
 // 基本数据
 const arrid = ref([
@@ -263,6 +259,31 @@
   console.log('type', type);
   GetcomIDs.value = [];
   let dataId = '';
+
+  if (videoList.value.includes(type)) {
+    // 视频单独的获取菜单的
+    let params = {
+      dataCode: type,
+      scene: 'basis_monitor',
+    };
+    drainageDispatchGetMenuVidoe(params).then(res => {
+      console.log('获得的菜单', res.data);
+      Getmenuarr.value = res.data;
+      if (res.data && res.data.length) {
+        res.data.map(item => {
+          GetcomIDs.value.push(item.moduleName);
+        });
+      }
+
+      dialogConfig.visible = true;
+      dialogConfig.dataCode = type;
+      dialogConfig.dataID = Getproperties.value.stCode;
+      dialogConfig.comIDs = GetcomIDs.value;
+    });
+
+    return;
+  }
+
   if (arrstcode.value.includes(type)) {
     dataId = Getproperties.value.stCode;
   }
@@ -270,6 +291,7 @@
   if (arrid.value.includes(type)) {
     dataId = Getproperties.value.pid ? Getproperties.value.pid : Getproperties.value.id;
   }
+
   console.log('dataId', dataId);
   if (!dataId) {
     //渍水调度
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
index f00b69a..acfd6af 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ShiPingJianKong.vue
@@ -60,20 +60,7 @@
   ],
 });
 const cameraName = ref('');
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
+const leftList = ref([]);
 
 // 左侧点击
 function leftclick(item) {
@@ -82,6 +69,7 @@
 
 // 获取监控视频列表
 function GetcameraList() {
+  console.log('props.videoList', props.videoList);
   // 如果是单独视频站点的类型 就没有多个 不用查询 直接赋值点击地图获取到的stcode
   if (props.videoList.includes(props.dataCode)) {
     AllData.cameraIndexCode = props.dataId;
@@ -114,8 +102,14 @@
 }
 
 onMounted(() => {
+  console.log('搞什么啊', props, props.dataId);
   GetcameraList();
-  console.log('props', props);
+});
+onBeforeUnmount(() => {
+  if (AllData.myVideoPlayer) {
+    hideDHPlayer();
+    AllData.myVideoPlayer.destroy();
+  }
 });
 </script>
 
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue
deleted file mode 100644
index 16f461f..0000000
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/videoOne.vue
+++ /dev/null
@@ -1,168 +0,0 @@
-<template>
-  <div id="shipingjiankong">
-    <div class="leftbox">
-      <div
-        class="boxitem"
-        :class="item.cameraId == AllData.cameraIndexCode ? 'actived' : ''"
-        v-for="item in leftList"
-        :key="item"
-        :title="item.cameraName"
-        @click="leftclick(item)"
-      >
-        {{ item.cameraName }}
-      </div>
-    </div>
-    <div class="rightbox">
-      <!-- <HKVideo
-        ref="video"
-        :appkey="videoConfig.appKey"
-        :secret="videoConfig.appSecret"
-        :ip="videoConfig.ip"
-        :port="videoConfig.port"
-        :cameraIndexCode="AllData.cameraIndexCode"
-        :layout="AllData.layout"
-        :defaultList="AllData.defaultList"
-      ></HKVideo> -->
-      <videoDHone :channelId="AllData.cameraIndexCode"></videoDHone>
-    </div>
-  </div>
-</template>
-
-<script setup name="shipingjiankong">
-// import HKVideo from '@/components/videoHK/index.vue';
-import { HKconfig } from '@/utils/HKConfig';
-import { getdataCamera } from '@/api/MonitorAssetsOnMap';
-import videoDHone from '@/components/videoDHone/index.vue'; //实时视频
-
-const props = defineProps({
-  // 数据id
-  dataID: {
-    type: String,
-  },
-  dataCode: {
-    type: String,
-  },
-  // 默认打开tabs的key
-  RefreshName: {
-    type: String,
-  },
-  tabsType: {
-    type: String,
-  },
-  typeName: {
-    type: String,
-  },
-  arrstcode: {
-    type: Array,
-  },
-  arrid: {
-    type: Array,
-  },
-});
-
-const AllData = reactive({
-  cameraIndexCode: '0030845749854a8186d43306256112e7',
-  layout: '1x1',
-  defaultList: [
-    // { cameraIndexCode: "f8b48c890c054ac190c124bb190a7007", wndId: 7 },
-    // { cameraIndexCode: "09aa2a2694744cb8b188442b0b2af9b7", wndId: 6 },
-  ],
-});
-const cameraName = ref('');
-const videoConfig = reactive({
-  appKey: HKconfig.appkey,
-  appSecret: HKconfig.secret,
-  ip: HKconfig.ip,
-  port: HKconfig.port,
-});
-const leftList = ref([
-  {
-    name: '视频1',
-    value: '1',
-  },
-  {
-    name: '视频2',
-    value: '2',
-  },
-  {
-    name: '视频3',
-    value: '3',
-  },
-]);
-
-// 左侧点击
-function leftclick(item) {
-  AllData.cameraIndexCode = item.cameraId;
-}
-
-// 获取监控视频列表
-function GetcameraList() {
-  let params = {};
-  // 站点的参数
-  if (props.arrstcode.includes(props.dataCode)) {
-    params.stCode = props.dataID;
-    params.dataCode = 'site';
-  }
-
-  // 基础数据的参数
-  if (props.arrid.includes(props.dataCode)) {
-    params.dataId = props.dataID;
-    params.dataCode = props.dataCode;
-  }
-
-  let data = {
-    ...params,
-    cameraName: cameraName.value,
-  };
-  getdataCamera(data).then(res => {
-    console.log('res', res);
-    leftList.value = res.data;
-    // leftclick(res.data[0]);
-    AllData.cameraIndexCode = res.data[0].cameraId;
-  });
-}
-
-onMounted(() => {
-  GetcameraList();
-  console.log('props', props);
-});
-</script>
-
-<style lang="scss" scoped>
-#shipingjiankong {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  color: #ccefff;
-}
-
-.leftbox {
-  width: 200px;
-  padding: 0 5px;
-
-  .boxitem {
-    cursor: pointer;
-    width: 100%;
-    text-align: center;
-    padding: 5px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    /* 超出部分省略号 */
-    word-break: break-all;
-    /* break-all(允许在单词内换行。) */
-    display: -webkit-box;
-    /* 对象作为伸缩盒子模型显示 */
-    -webkit-box-orient: vertical;
-    /* 设置或检索伸缩盒对象的子元素的排列方式 */
-    -webkit-line-clamp: 1;
-
-    &.actived {
-      color: #1fa9f6;
-      border: 1px solid #1fa9f6;
-    }
-  }
-}
-.rightbox {
-  width: calc(100% - 200px);
-}
-</style>
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue b/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue
index 7396b2a..c8ef81e 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/dialogTabs.vue
@@ -5,17 +5,8 @@
       <div class="closeIcon" @click="closeFun"></div>
     </div>
     <div class="contentBox flex-1">
-      <el-tabs
-        v-model="AllData.editableTabsValue"
-        :stretch="true"
-        @tab-click="TabsChange"
-      >
-        <el-tab-pane
-          v-for="item in AllData.editableTabs"
-          :key="item.name"
-          :label="item.title"
-          :name="item.name"
-        >
+      <el-tabs v-model="AllData.editableTabsValue" :stretch="true" @tab-click="TabsChange">
+        <el-tab-pane v-for="item in AllData.editableTabs" :key="item.name" :label="item.title" :name="item.name">
           <component
             :is="item.content"
             :dataID="dataID"
@@ -28,6 +19,7 @@
             v-if="AllData.RefreshName == item.name"
             :arrstcode="arrstcode"
             :arrid="arrid"
+            :videoList="videoList"
             :Getproperties="Getproperties"
           ></component>
         </el-tab-pane>
@@ -37,9 +29,9 @@
 </template>
 
 <script setup name="NewdialogTabs">
-import { ref, reactive, toRefs, onMounted } from "vue";
-const emit = defineEmits(["closeFun"]);
-import Config from "./DialogConfig";
+import { ref, reactive, toRefs, onMounted } from 'vue';
+const emit = defineEmits(['closeFun']);
+import Config from './DialogConfig';
 // 父元素传值
 // debugger;
 const props = defineProps({
@@ -80,16 +72,19 @@
   Getmenuarr: {
     type: Array,
   },
+  videoList: {
+    type: Array,
+  },
 });
 
 // 声明本页面中的变量
 const AllData = reactive({
-  editableTabsValue: "",
+  editableTabsValue: '',
   editableTabs: [],
-  RefreshName: "",
+  RefreshName: '',
 });
 
-const updateTabsType = (name) => {
+const updateTabsType = name => {
   AllData.editableTabsValue = name;
   AllData.RefreshName = name;
 };
@@ -99,16 +94,17 @@
   // console.log(tab, AllData.RefreshName);
 };
 const closeFun = () => {
-  emit("closeFun", false);
+  emit('closeFun', false);
 };
 onMounted(() => {
+  console.log('搞什么啊', props);
   // 获取当前组件已分配的组件ID与配置文件中的公共组件ID进行对比,控制展示的tab选项
   let ComparisonTable = Config.ComparisonTable;
   AllData.editableTabs = [];
   Promise.all(
     ComparisonTable.map(function (element) {
       // 动态修改后台返回的组件名称
-      props.Getmenuarr.map((item) => {
+      props.Getmenuarr.map(item => {
         if (item.moduleName == element.name) {
           element.title = item.menuName;
           element.show = item.show;
@@ -120,13 +116,13 @@
       }
     })
   ).then(function (data) {
-    data = data.filter((n) => n);
+    data = data.filter(n => n);
     //赋值其拥有的公共组件
     AllData.editableTabs = AllData.editableTabs.concat(data);
-    console.log(AllData.editableTabs, "公共组件");
+    console.log(AllData.editableTabs, '公共组件');
     //对自定义组件进行插入
-    props.customComponents.forEach((element) => {
-      if (element.sort && element.sort != "") {
+    props.customComponents.forEach(element => {
+      if (element.sort && element.sort != '') {
         // 如果有排序,就按照排序顺序插入到editableTabs中
         AllData.editableTabs.splice(element.sort, 0, element);
       } else if (element.sort == 0) {
@@ -137,11 +133,7 @@
         AllData.editableTabs.push(element);
       }
     });
-    if (
-      props.RefName == "" ||
-      props.RefName == undefined ||
-      !props.comIDs.includes(props.RefName)
-    ) {
+    if (props.RefName == '' || props.RefName == undefined || !props.comIDs.includes(props.RefName)) {
       // 默认展示第一个
       AllData.editableTabsValue = AllData.editableTabs[0].name;
       AllData.RefreshName = AllData.editableTabs[0].name;
diff --git a/vite.config.js b/vite.config.js
index 6093014..60aaa88 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -5,11 +5,13 @@
 import autoprefixer from 'autoprefixer';
 
 const Timestamp = new Date().getTime(); //随机时间戳
-let ipLink = 'https://server1.wh-nf.cn:8201/prod-api';
+// let ipLink = 'https://server1.wh-nf.cn:8201/prod-api';
 // let ipLink = 'http://192.168.16.135:9100';
 // let ipLink = 'https://dhgx.wh-nf.cn:8201/prod-api';
 // let ipLink = 'http://192.168.16.124:9100';
 // let ipLink = 'http://192.168.20.43:9100'; // 刘总
+let ipLink = 'http://192.168.16.43:9100';
+
 /*  */
 // https://vitejs.dev/config/
 export default defineConfig(({ mode, command }) => {