diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]
diff --git a/src/views/device/deviceManage/deviceManage-interface.ts b/src/views/device/deviceManage/deviceManage-interface.ts
new file mode 100644
index 0000000..22bb34a
--- /dev/null
+++ b/src/views/device/deviceManage/deviceManage-interface.ts
@@ -0,0 +1,32 @@
+// 列表查询
+export interface IListQuery {
+  robotCode: string // 设备编号
+  robotName: string // 设备名称
+  limit: number
+  offset: number
+}
+
+// 表格数据
+export interface IList {
+  id: string //	主键
+  robotCode: string //	机器狗编号
+  robotCell: string //	电量
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: number //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
+
+export interface IForm {
+  id: string //	主键
+  robotCell: string //	电量
+  robotCode: string //	机器狗编号
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: string //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]
diff --git a/src/views/device/deviceManage/deviceManage-interface.ts b/src/views/device/deviceManage/deviceManage-interface.ts
new file mode 100644
index 0000000..22bb34a
--- /dev/null
+++ b/src/views/device/deviceManage/deviceManage-interface.ts
@@ -0,0 +1,32 @@
+// 列表查询
+export interface IListQuery {
+  robotCode: string // 设备编号
+  robotName: string // 设备名称
+  limit: number
+  offset: number
+}
+
+// 表格数据
+export interface IList {
+  id: string //	主键
+  robotCode: string //	机器狗编号
+  robotCell: string //	电量
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: number //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
+
+export interface IForm {
+  id: string //	主键
+  robotCell: string //	电量
+  robotCode: string //	机器狗编号
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: string //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
diff --git a/src/views/device/deviceManage/editDialog.vue b/src/views/device/deviceManage/editDialog.vue
new file mode 100644
index 0000000..5dc16d4
--- /dev/null
+++ b/src/views/device/deviceManage/editDialog.vue
@@ -0,0 +1,188 @@
+<!-- 新增、编辑设备 -->
+<script lang="ts" setup name="DeviceManageEdit">
+import { reactive, ref } from 'vue'
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
+import { addDevice, editDevice } from '@/api/device/deviceManage'
+import { isIp, isPort } from '@/utils/validate'
+const emits = defineEmits(['closeRefresh'])
+const dialogStatus = ref('add')
+const dialogVisible = ref(false) // 弹窗显示隐藏
+// 显示标题
+const textMap: { [key: string]: string } = {
+  detail: '详情',
+  edit: '编辑',
+  add: '新增',
+}
+
+// 表单数据对象
+const formData = ref({
+  id: '', //	主键
+  robotCode: '', //	设备编号
+  robotIp: '', //	设备ip
+  robotName: '', //	设备名称
+  robotPort: '', //	设备端口
+  // robotCell: '', //	电量
+  // robotStatus: '', //	设备状态(1,在线，离线)
+  // routeId: '', // 正在执行路线id
+  // valid: '', //	删除状态(1,有效，0无效)
+})
+const btnLoading = ref(false) // 保存按钮加载状态
+const formDataRef = ref<FormInstance>() // 表单对象
+
+const validateIp = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('ip必填'))
+  }
+  else if (!isIp(value)) {
+    callback(new Error('请输入正确的ip'))
+  }
+  else {
+    callback()
+  }
+}
+
+const validatePort = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('端口必填'))
+  }
+  else if (!isPort(value)) {
+    callback(new Error('请输入正确的端口'))
+  }
+  else {
+    callback()
+  }
+}
+// 校验规则
+const rules = reactive<FormRules>({
+  robotCode: [{ required: true, message: '设备编号必填', trigger: ['blur', 'change'] }],
+  robotName: [{ required: true, message: '设备名称必填', trigger: ['blur', 'change'] }],
+  robotIp: [{ required: true, validator: validateIp, trigger: ['blur', 'change'] }],
+  robotPort: [{ required: true, validator: validatePort, trigger: ['blur', 'change'] }],
+})
+
+// -------------------------------------------------------------------------------------------
+// 表单提交
+function submitForm() {
+  // return ElMessage.info('敬请期待')
+  if (formDataRef.value) {
+    formDataRef.value?.validate((valid: boolean) => {
+      if (valid) {
+        const params = {
+          ...formData.value,
+        }
+        if (dialogStatus.value === 'add') { // 新建
+          addDevice(params).then((res) => {
+            ElMessage.success('新增成功')
+            closeRefresh()
+          })
+        }
+        else if (dialogStatus.value === 'edit') { // 编辑
+          editDevice(params).then((res) => {
+            ElMessage.success('编辑成功')
+            closeRefresh()
+          })
+        }
+      }
+    })
+  }
+}
+
+// 重置表单
+function resetForm() {
+  formData.value = {
+    id: '', //	主键
+    robotCode: '', //	设备编号
+    robotIp: '', //	设备ip
+    robotName: '', //	设备名称
+    robotPort: '', //	设备端口
+    // robotCell: '', //	电量
+    // robotStatus: '', //	设备状态(1,在线，离线)
+    // routeId: '', // 正在执行路线id
+    // valid: '', //	删除状态(1,有效，0无效)
+  }
+}
+// -----------------------------------初始化、关闭对话框相关-----------------------------------------
+function initDialog(dialogstatus: string, row: any) {
+  dialogVisible.value = true
+  if (dialogstatus === 'edit' || dialogstatus === 'detail') {
+    formData.value.id = row.id
+    formData.value.robotCode = row.robotCode //	设备编号
+    formData.value.robotIp = row.robotIp //	设备ip
+    formData.value.robotName = row.robotName //	设备名称
+    formData.value.robotPort = row.robotPort //	设备端口
+    // formData.value.robotCell = '' //	电量
+    // formData.value.robotStatus = '' //	设备状态(1在线，离线)
+    // formData.value.routeId = '' // 正在执行路线id
+    // formData.value.valid = '' //	删除状态(1,有效，0无效)
+  }
+
+  // 详情隐藏表单校验
+  if (dialogstatus === 'detail') {
+    formDataRef.value?.clearValidate()
+  }
+  dialogStatus.value = dialogstatus // 类型 新建add 编辑edit 详情detail
+  btnLoading.value = false
+}
+
+// 关闭并刷新
+function closeRefresh() {
+  dialogVisible.value = false
+  resetForm()
+  if (formDataRef.value) {
+    formDataRef.value?.clearValidate()
+  }
+  emits('closeRefresh')
+}
+
+// ----------------------- 以下是暴露的方法内容 ----------------------------
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog
+    v-model="dialogVisible" :title="textMap[dialogStatus]" width="600" :before-close="closeRefresh" append-to-body
+    :open-delay="0" :close-on-click-modal="false"
+  >
+    <el-form
+      ref="formDataRef" :model="formData" :rules="rules" label-position="right" label-width="130px"
+      class="form-container" size="default" :disabled="dialogStatus === 'detail'" @submit.prevent
+    >
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form-item label="设备编号" prop="robotCode">
+            <el-input v-model="formData.robotCode" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="设备名称" prop="robotName">
+            <el-input v-model="formData.robotName" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="ip" prop="robotIp">
+            <el-input v-model="formData.robotIp" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="端口" prop="robotPort">
+            <el-input v-model="formData.robotPort" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button v-if="dialogStatus !== 'detail'" :loading="btnLoading" type="primary" @click="submitForm">
+          保存
+        </el-button>
+        <el-button @click="closeRefresh">
+          取消
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+//
+</style>

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]
diff --git a/src/views/device/deviceManage/deviceManage-interface.ts b/src/views/device/deviceManage/deviceManage-interface.ts
new file mode 100644
index 0000000..22bb34a
--- /dev/null
+++ b/src/views/device/deviceManage/deviceManage-interface.ts
@@ -0,0 +1,32 @@
+// 列表查询
+export interface IListQuery {
+  robotCode: string // 设备编号
+  robotName: string // 设备名称
+  limit: number
+  offset: number
+}
+
+// 表格数据
+export interface IList {
+  id: string //	主键
+  robotCode: string //	机器狗编号
+  robotCell: string //	电量
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: number //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
+
+export interface IForm {
+  id: string //	主键
+  robotCell: string //	电量
+  robotCode: string //	机器狗编号
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: string //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
diff --git a/src/views/device/deviceManage/editDialog.vue b/src/views/device/deviceManage/editDialog.vue
new file mode 100644
index 0000000..5dc16d4
--- /dev/null
+++ b/src/views/device/deviceManage/editDialog.vue
@@ -0,0 +1,188 @@
+<!-- 新增、编辑设备 -->
+<script lang="ts" setup name="DeviceManageEdit">
+import { reactive, ref } from 'vue'
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
+import { addDevice, editDevice } from '@/api/device/deviceManage'
+import { isIp, isPort } from '@/utils/validate'
+const emits = defineEmits(['closeRefresh'])
+const dialogStatus = ref('add')
+const dialogVisible = ref(false) // 弹窗显示隐藏
+// 显示标题
+const textMap: { [key: string]: string } = {
+  detail: '详情',
+  edit: '编辑',
+  add: '新增',
+}
+
+// 表单数据对象
+const formData = ref({
+  id: '', //	主键
+  robotCode: '', //	设备编号
+  robotIp: '', //	设备ip
+  robotName: '', //	设备名称
+  robotPort: '', //	设备端口
+  // robotCell: '', //	电量
+  // robotStatus: '', //	设备状态(1,在线，离线)
+  // routeId: '', // 正在执行路线id
+  // valid: '', //	删除状态(1,有效，0无效)
+})
+const btnLoading = ref(false) // 保存按钮加载状态
+const formDataRef = ref<FormInstance>() // 表单对象
+
+const validateIp = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('ip必填'))
+  }
+  else if (!isIp(value)) {
+    callback(new Error('请输入正确的ip'))
+  }
+  else {
+    callback()
+  }
+}
+
+const validatePort = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('端口必填'))
+  }
+  else if (!isPort(value)) {
+    callback(new Error('请输入正确的端口'))
+  }
+  else {
+    callback()
+  }
+}
+// 校验规则
+const rules = reactive<FormRules>({
+  robotCode: [{ required: true, message: '设备编号必填', trigger: ['blur', 'change'] }],
+  robotName: [{ required: true, message: '设备名称必填', trigger: ['blur', 'change'] }],
+  robotIp: [{ required: true, validator: validateIp, trigger: ['blur', 'change'] }],
+  robotPort: [{ required: true, validator: validatePort, trigger: ['blur', 'change'] }],
+})
+
+// -------------------------------------------------------------------------------------------
+// 表单提交
+function submitForm() {
+  // return ElMessage.info('敬请期待')
+  if (formDataRef.value) {
+    formDataRef.value?.validate((valid: boolean) => {
+      if (valid) {
+        const params = {
+          ...formData.value,
+        }
+        if (dialogStatus.value === 'add') { // 新建
+          addDevice(params).then((res) => {
+            ElMessage.success('新增成功')
+            closeRefresh()
+          })
+        }
+        else if (dialogStatus.value === 'edit') { // 编辑
+          editDevice(params).then((res) => {
+            ElMessage.success('编辑成功')
+            closeRefresh()
+          })
+        }
+      }
+    })
+  }
+}
+
+// 重置表单
+function resetForm() {
+  formData.value = {
+    id: '', //	主键
+    robotCode: '', //	设备编号
+    robotIp: '', //	设备ip
+    robotName: '', //	设备名称
+    robotPort: '', //	设备端口
+    // robotCell: '', //	电量
+    // robotStatus: '', //	设备状态(1,在线，离线)
+    // routeId: '', // 正在执行路线id
+    // valid: '', //	删除状态(1,有效，0无效)
+  }
+}
+// -----------------------------------初始化、关闭对话框相关-----------------------------------------
+function initDialog(dialogstatus: string, row: any) {
+  dialogVisible.value = true
+  if (dialogstatus === 'edit' || dialogstatus === 'detail') {
+    formData.value.id = row.id
+    formData.value.robotCode = row.robotCode //	设备编号
+    formData.value.robotIp = row.robotIp //	设备ip
+    formData.value.robotName = row.robotName //	设备名称
+    formData.value.robotPort = row.robotPort //	设备端口
+    // formData.value.robotCell = '' //	电量
+    // formData.value.robotStatus = '' //	设备状态(1在线，离线)
+    // formData.value.routeId = '' // 正在执行路线id
+    // formData.value.valid = '' //	删除状态(1,有效，0无效)
+  }
+
+  // 详情隐藏表单校验
+  if (dialogstatus === 'detail') {
+    formDataRef.value?.clearValidate()
+  }
+  dialogStatus.value = dialogstatus // 类型 新建add 编辑edit 详情detail
+  btnLoading.value = false
+}
+
+// 关闭并刷新
+function closeRefresh() {
+  dialogVisible.value = false
+  resetForm()
+  if (formDataRef.value) {
+    formDataRef.value?.clearValidate()
+  }
+  emits('closeRefresh')
+}
+
+// ----------------------- 以下是暴露的方法内容 ----------------------------
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog
+    v-model="dialogVisible" :title="textMap[dialogStatus]" width="600" :before-close="closeRefresh" append-to-body
+    :open-delay="0" :close-on-click-modal="false"
+  >
+    <el-form
+      ref="formDataRef" :model="formData" :rules="rules" label-position="right" label-width="130px"
+      class="form-container" size="default" :disabled="dialogStatus === 'detail'" @submit.prevent
+    >
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form-item label="设备编号" prop="robotCode">
+            <el-input v-model="formData.robotCode" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="设备名称" prop="robotName">
+            <el-input v-model="formData.robotName" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="ip" prop="robotIp">
+            <el-input v-model="formData.robotIp" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="端口" prop="robotPort">
+            <el-input v-model="formData.robotPort" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button v-if="dialogStatus !== 'detail'" :loading="btnLoading" type="primary" @click="submitForm">
+          保存
+        </el-button>
+        <el-button @click="closeRefresh">
+          取消
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+//
+</style>
diff --git a/src/views/device/deviceManage/list.vue b/src/views/device/deviceManage/list.vue
new file mode 100644
index 0000000..582073a
--- /dev/null
+++ b/src/views/device/deviceManage/list.vue
@@ -0,0 +1,155 @@
+<!-- 设备管理 -->
+<script lang="ts" setup name="DeviceManageList">
+import type { Ref } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { IList, IListQuery } from './deviceManage-interface'
+import editDialog from './editDialog.vue'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { deleteDevice, getDeviceList } from '@/api/device/deviceManage'
+const { proxy } = getCurrentInstance() as any
+const router = useRouter()
+const fileRef = ref() // 文件上传input
+const editDialogRef = ref()
+const loading = ref(false)
+// ------------------------------------------------------------------------------------------
+// 默认查询条件
+const listQuery: Ref<IListQuery> = ref({
+  robotCode: '', // 设备编号
+  robotName: '', // 设备名称
+  offset: 1,
+  limit: 20,
+})
+// ------------------------------------------表格---------------------------------------------
+const columns: TableColumn[] = [
+  { text: '设备编号', value: 'robotCode', align: 'center' },
+  { text: '设备名称', value: 'robotName', align: 'center' },
+  { text: 'IP', value: 'robotIp', align: 'center' },
+  { text: '端口', value: 'robotPort', align: 'center' },
+  { text: '状态', value: 'robotStatusName', width: '90', align: 'center', styleFilter: (row: IList) => { return row.robotStatus == '1' ? 'color: #1aa034' : 'red' } },
+  { text: '电量', value: 'robotCell', align: 'center' },
+]
+const total = ref(0) // 数据条数
+const list: any = ref([]) // 数据条数
+const checkoutList = ref([]) // 数据条数
+
+// 查询数据
+const fetchData = () => {
+  loading.value = true
+  getDeviceList(listQuery.value).then((res: { data: { rows: []; total: number } }) => {
+    list.value = res.data.rows.map((item: IList) => {
+      return {
+        ...item,
+        robotCell: `${item.robotCell}` ? `${item.robotCell}%` : item.robotCell, // 电量
+        robotStatusName: `${item.robotStatus}` === '1' ? '在线' : '离线', // 设备状态
+      }
+    })
+    total.value = res.data.total
+    loading.value = false
+  })
+  loading.value = false
+}
+
+// 搜索重置
+const reset = () => {
+  listQuery.value = {
+    robotCode: '', // 设备编号
+    robotName: '', // 设备名称
+    offset: 1,
+    limit: 20,
+  }
+  fetchData()
+}
+
+// 搜索按钮
+function search() {
+  fetchData()
+}
+
+// 新增
+const add = () => {
+  editDialogRef.value.initDialog('add')
+}
+// 详情
+const detail = (row: IList) => {
+  editDialogRef.value.initDialog('detail', row)
+}
+// 编辑
+const edit = (row: IList) => {
+  editDialogRef.value.initDialog('edit', row)
+}
+// 删除
+const del = (row: IList) => {
+  ElMessageBox.confirm(
+    '确定删除吗？',
+    '确认删除',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  ).then(() => {
+    deleteDevice({ ids: [row.id] }).then(() => {
+      ElMessage.success('删除成功')
+      fetchData()
+    })
+  })
+}
+
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+function changePage(val: { size: number; page: number }) {
+  if (val && val.size) {
+    listQuery.value.limit = val.size
+  }
+  if (val && val.page) {
+    listQuery.value.offset = val.page
+  }
+  fetchData()
+}
+
+onMounted(async () => {
+  fetchData()
+})
+</script>
+
+<template>
+  <app-container>
+    <search-area :need-clear="true" @search="search" @clear="reset">
+      <search-item>
+        <el-input v-model.trim="listQuery.robotCode" placeholder="设备编号" clearable />
+      </search-item>
+      <search-item>
+        <el-input v-model.trim="listQuery.robotName" placeholder="设备名称" clearable />
+      </search-item>
+    </search-area>
+    <table-container>
+      <template #btns-right>
+        <icon-button icon="icon-add" title="新增" @click="add" />
+      </template>
+      <normal-table :query="listQuery" :list-loading="loading" :columns="columns" :data="list" :total="total" :border="false" @change="changePage">
+        <template #preColumns>
+          <el-table-column label="序号" width="55" align="center">
+            <template #default="scope">
+              {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+        </template>
+        <template #columns>
+          <el-table-column label="操作" width="150" align="center">
+            <template #default="scope">
+              <el-button type="primary" link size="small" class="table-text-button" @click="detail(scope.row)">
+                详情
+              </el-button>
+              <el-button type="primary" link size="small" class="table-text-button" @click="edit(scope.row)">
+                编辑
+              </el-button>
+              <el-button type="danger" link size="small" class="table-text-button" @click="del(scope.row)">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </template>
+      </normal-table>
+    </table-container>
+    <edit-dialog ref="editDialogRef" @close-refresh="search" />
+  </app-container>
+</template>

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]
diff --git a/src/views/device/deviceManage/deviceManage-interface.ts b/src/views/device/deviceManage/deviceManage-interface.ts
new file mode 100644
index 0000000..22bb34a
--- /dev/null
+++ b/src/views/device/deviceManage/deviceManage-interface.ts
@@ -0,0 +1,32 @@
+// 列表查询
+export interface IListQuery {
+  robotCode: string // 设备编号
+  robotName: string // 设备名称
+  limit: number
+  offset: number
+}
+
+// 表格数据
+export interface IList {
+  id: string //	主键
+  robotCode: string //	机器狗编号
+  robotCell: string //	电量
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: number //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
+
+export interface IForm {
+  id: string //	主键
+  robotCell: string //	电量
+  robotCode: string //	机器狗编号
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: string //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
diff --git a/src/views/device/deviceManage/editDialog.vue b/src/views/device/deviceManage/editDialog.vue
new file mode 100644
index 0000000..5dc16d4
--- /dev/null
+++ b/src/views/device/deviceManage/editDialog.vue
@@ -0,0 +1,188 @@
+<!-- 新增、编辑设备 -->
+<script lang="ts" setup name="DeviceManageEdit">
+import { reactive, ref } from 'vue'
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
+import { addDevice, editDevice } from '@/api/device/deviceManage'
+import { isIp, isPort } from '@/utils/validate'
+const emits = defineEmits(['closeRefresh'])
+const dialogStatus = ref('add')
+const dialogVisible = ref(false) // 弹窗显示隐藏
+// 显示标题
+const textMap: { [key: string]: string } = {
+  detail: '详情',
+  edit: '编辑',
+  add: '新增',
+}
+
+// 表单数据对象
+const formData = ref({
+  id: '', //	主键
+  robotCode: '', //	设备编号
+  robotIp: '', //	设备ip
+  robotName: '', //	设备名称
+  robotPort: '', //	设备端口
+  // robotCell: '', //	电量
+  // robotStatus: '', //	设备状态(1,在线，离线)
+  // routeId: '', // 正在执行路线id
+  // valid: '', //	删除状态(1,有效，0无效)
+})
+const btnLoading = ref(false) // 保存按钮加载状态
+const formDataRef = ref<FormInstance>() // 表单对象
+
+const validateIp = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('ip必填'))
+  }
+  else if (!isIp(value)) {
+    callback(new Error('请输入正确的ip'))
+  }
+  else {
+    callback()
+  }
+}
+
+const validatePort = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('端口必填'))
+  }
+  else if (!isPort(value)) {
+    callback(new Error('请输入正确的端口'))
+  }
+  else {
+    callback()
+  }
+}
+// 校验规则
+const rules = reactive<FormRules>({
+  robotCode: [{ required: true, message: '设备编号必填', trigger: ['blur', 'change'] }],
+  robotName: [{ required: true, message: '设备名称必填', trigger: ['blur', 'change'] }],
+  robotIp: [{ required: true, validator: validateIp, trigger: ['blur', 'change'] }],
+  robotPort: [{ required: true, validator: validatePort, trigger: ['blur', 'change'] }],
+})
+
+// -------------------------------------------------------------------------------------------
+// 表单提交
+function submitForm() {
+  // return ElMessage.info('敬请期待')
+  if (formDataRef.value) {
+    formDataRef.value?.validate((valid: boolean) => {
+      if (valid) {
+        const params = {
+          ...formData.value,
+        }
+        if (dialogStatus.value === 'add') { // 新建
+          addDevice(params).then((res) => {
+            ElMessage.success('新增成功')
+            closeRefresh()
+          })
+        }
+        else if (dialogStatus.value === 'edit') { // 编辑
+          editDevice(params).then((res) => {
+            ElMessage.success('编辑成功')
+            closeRefresh()
+          })
+        }
+      }
+    })
+  }
+}
+
+// 重置表单
+function resetForm() {
+  formData.value = {
+    id: '', //	主键
+    robotCode: '', //	设备编号
+    robotIp: '', //	设备ip
+    robotName: '', //	设备名称
+    robotPort: '', //	设备端口
+    // robotCell: '', //	电量
+    // robotStatus: '', //	设备状态(1,在线，离线)
+    // routeId: '', // 正在执行路线id
+    // valid: '', //	删除状态(1,有效，0无效)
+  }
+}
+// -----------------------------------初始化、关闭对话框相关-----------------------------------------
+function initDialog(dialogstatus: string, row: any) {
+  dialogVisible.value = true
+  if (dialogstatus === 'edit' || dialogstatus === 'detail') {
+    formData.value.id = row.id
+    formData.value.robotCode = row.robotCode //	设备编号
+    formData.value.robotIp = row.robotIp //	设备ip
+    formData.value.robotName = row.robotName //	设备名称
+    formData.value.robotPort = row.robotPort //	设备端口
+    // formData.value.robotCell = '' //	电量
+    // formData.value.robotStatus = '' //	设备状态(1在线，离线)
+    // formData.value.routeId = '' // 正在执行路线id
+    // formData.value.valid = '' //	删除状态(1,有效，0无效)
+  }
+
+  // 详情隐藏表单校验
+  if (dialogstatus === 'detail') {
+    formDataRef.value?.clearValidate()
+  }
+  dialogStatus.value = dialogstatus // 类型 新建add 编辑edit 详情detail
+  btnLoading.value = false
+}
+
+// 关闭并刷新
+function closeRefresh() {
+  dialogVisible.value = false
+  resetForm()
+  if (formDataRef.value) {
+    formDataRef.value?.clearValidate()
+  }
+  emits('closeRefresh')
+}
+
+// ----------------------- 以下是暴露的方法内容 ----------------------------
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog
+    v-model="dialogVisible" :title="textMap[dialogStatus]" width="600" :before-close="closeRefresh" append-to-body
+    :open-delay="0" :close-on-click-modal="false"
+  >
+    <el-form
+      ref="formDataRef" :model="formData" :rules="rules" label-position="right" label-width="130px"
+      class="form-container" size="default" :disabled="dialogStatus === 'detail'" @submit.prevent
+    >
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form-item label="设备编号" prop="robotCode">
+            <el-input v-model="formData.robotCode" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="设备名称" prop="robotName">
+            <el-input v-model="formData.robotName" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="ip" prop="robotIp">
+            <el-input v-model="formData.robotIp" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="端口" prop="robotPort">
+            <el-input v-model="formData.robotPort" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button v-if="dialogStatus !== 'detail'" :loading="btnLoading" type="primary" @click="submitForm">
+          保存
+        </el-button>
+        <el-button @click="closeRefresh">
+          取消
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+//
+</style>
diff --git a/src/views/device/deviceManage/list.vue b/src/views/device/deviceManage/list.vue
new file mode 100644
index 0000000..582073a
--- /dev/null
+++ b/src/views/device/deviceManage/list.vue
@@ -0,0 +1,155 @@
+<!-- 设备管理 -->
+<script lang="ts" setup name="DeviceManageList">
+import type { Ref } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { IList, IListQuery } from './deviceManage-interface'
+import editDialog from './editDialog.vue'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { deleteDevice, getDeviceList } from '@/api/device/deviceManage'
+const { proxy } = getCurrentInstance() as any
+const router = useRouter()
+const fileRef = ref() // 文件上传input
+const editDialogRef = ref()
+const loading = ref(false)
+// ------------------------------------------------------------------------------------------
+// 默认查询条件
+const listQuery: Ref<IListQuery> = ref({
+  robotCode: '', // 设备编号
+  robotName: '', // 设备名称
+  offset: 1,
+  limit: 20,
+})
+// ------------------------------------------表格---------------------------------------------
+const columns: TableColumn[] = [
+  { text: '设备编号', value: 'robotCode', align: 'center' },
+  { text: '设备名称', value: 'robotName', align: 'center' },
+  { text: 'IP', value: 'robotIp', align: 'center' },
+  { text: '端口', value: 'robotPort', align: 'center' },
+  { text: '状态', value: 'robotStatusName', width: '90', align: 'center', styleFilter: (row: IList) => { return row.robotStatus == '1' ? 'color: #1aa034' : 'red' } },
+  { text: '电量', value: 'robotCell', align: 'center' },
+]
+const total = ref(0) // 数据条数
+const list: any = ref([]) // 数据条数
+const checkoutList = ref([]) // 数据条数
+
+// 查询数据
+const fetchData = () => {
+  loading.value = true
+  getDeviceList(listQuery.value).then((res: { data: { rows: []; total: number } }) => {
+    list.value = res.data.rows.map((item: IList) => {
+      return {
+        ...item,
+        robotCell: `${item.robotCell}` ? `${item.robotCell}%` : item.robotCell, // 电量
+        robotStatusName: `${item.robotStatus}` === '1' ? '在线' : '离线', // 设备状态
+      }
+    })
+    total.value = res.data.total
+    loading.value = false
+  })
+  loading.value = false
+}
+
+// 搜索重置
+const reset = () => {
+  listQuery.value = {
+    robotCode: '', // 设备编号
+    robotName: '', // 设备名称
+    offset: 1,
+    limit: 20,
+  }
+  fetchData()
+}
+
+// 搜索按钮
+function search() {
+  fetchData()
+}
+
+// 新增
+const add = () => {
+  editDialogRef.value.initDialog('add')
+}
+// 详情
+const detail = (row: IList) => {
+  editDialogRef.value.initDialog('detail', row)
+}
+// 编辑
+const edit = (row: IList) => {
+  editDialogRef.value.initDialog('edit', row)
+}
+// 删除
+const del = (row: IList) => {
+  ElMessageBox.confirm(
+    '确定删除吗？',
+    '确认删除',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  ).then(() => {
+    deleteDevice({ ids: [row.id] }).then(() => {
+      ElMessage.success('删除成功')
+      fetchData()
+    })
+  })
+}
+
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+function changePage(val: { size: number; page: number }) {
+  if (val && val.size) {
+    listQuery.value.limit = val.size
+  }
+  if (val && val.page) {
+    listQuery.value.offset = val.page
+  }
+  fetchData()
+}
+
+onMounted(async () => {
+  fetchData()
+})
+</script>
+
+<template>
+  <app-container>
+    <search-area :need-clear="true" @search="search" @clear="reset">
+      <search-item>
+        <el-input v-model.trim="listQuery.robotCode" placeholder="设备编号" clearable />
+      </search-item>
+      <search-item>
+        <el-input v-model.trim="listQuery.robotName" placeholder="设备名称" clearable />
+      </search-item>
+    </search-area>
+    <table-container>
+      <template #btns-right>
+        <icon-button icon="icon-add" title="新增" @click="add" />
+      </template>
+      <normal-table :query="listQuery" :list-loading="loading" :columns="columns" :data="list" :total="total" :border="false" @change="changePage">
+        <template #preColumns>
+          <el-table-column label="序号" width="55" align="center">
+            <template #default="scope">
+              {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+        </template>
+        <template #columns>
+          <el-table-column label="操作" width="150" align="center">
+            <template #default="scope">
+              <el-button type="primary" link size="small" class="table-text-button" @click="detail(scope.row)">
+                详情
+              </el-button>
+              <el-button type="primary" link size="small" class="table-text-button" @click="edit(scope.row)">
+                编辑
+              </el-button>
+              <el-button type="danger" link size="small" class="table-text-button" @click="del(scope.row)">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </template>
+      </normal-table>
+    </table-container>
+    <edit-dialog ref="editDialogRef" @close-refresh="search" />
+  </app-container>
+</template>
diff --git a/src/views/patrol/manage/index.vue b/src/views/patrol/manage/index.vue
index fadf39b..3670322 100644
--- a/src/views/patrol/manage/index.vue
+++ b/src/views/patrol/manage/index.vue
@@ -11,11 +11,14 @@
 import { getDictByCode } from '@/api/system/dict'
 import useSocket from '@/store/modules/websocket'
 import { getDeviceList, getRouteLog } from '@/api/patrol/manage'
+import changeDeviceDialog from '@/views/patrol/navigation/dialog/changeDeviceDialog.vue'
 import { controlDevice, delRoute, getRouteByDog, getRouteList } from '@/api/patrol/navigation'
+const { proxy } = getCurrentInstance() as any
 const socket = useSocket()
 const mapRef = ref() // 地图组件
+const tableHeight = ref(500) // 表格高度
 const currentDevice: any = ref({
-  id: '',
+  id: '', // 当前设备id
   robotName: '--', // 设备名称
   robotCode: '--', // 设备编号
   robotStatus: '--', // 1,有效，0无效
@@ -26,19 +29,23 @@
   name: '--', // 小区名称
   address: '--', // 小区地址
 })
+const routePointsList: any = ref([]) // 巡检路线列表
+
+// -----------------------------------------更换、解除设备----------------------------------------
+const changeDeviceDialogRef = ref()
 // 点击更换设备
 const changeDevice = () => {
-  ElMessageBox.confirm(
-    '确定更换设备吗？',
-    '提示',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-  ).then(() => {
-    ElMessage.info('敬请期待')
-  })
+  changeDeviceDialogRef.value.initDialog(currentDevice.value.id)
+}
+
+// 确认更换设备
+const confirmChangeDevice = (value: any) => {
+  currentDevice.value.id = value[0].id
+  currentDevice.value.robotName = value[0].robotName // 设备名称
+  currentDevice.value.robotCode = value[0].robotCode // 设备编号
+  currentDevice.value.robotStatus = `${value[0].robotStatus}` === '1' ? '工作中' : '离线' // 1,有效，0无效
+  currentDevice.value.robotCell = `${value[0].robotCell}` ? `${value[0].robotCell}%` : '--' // 电量
+  fetchRouteByDog(currentDevice.value.id) // 根据设备区查询当前巡检路线
 }
 
 // 点击解除绑定
@@ -73,7 +80,7 @@
 const columns: any = ref([
   { text: '巡检内容', value: 'patrolTypeName', align: 'center' },
   { text: '巡检情况', value: 'patrolContent', align: 'center' },
-  { text: '甲烷浓度(ppm.m)', value: 'situation', align: 'center' },
+  { text: '甲烷浓度(ppm.m)', value: 'gas', align: 'center' },
   { text: '时间', value: 'createTime', align: 'center' },
 ])
 const listQuery = ref({
@@ -113,12 +120,49 @@
   fetchRouteLog()
 }
 
+// 刚进入页面查询第一个燃气报警点，并在图上绘制出来
+function fetchAlarm() {
+  const params = {
+    routeInfoId: '',
+    limit: 99999,
+    offset: 1,
+    patrolType: '10011',
+  }
+  getRouteLog(params).then((res) => {
+    let firstData = []
+    if (res && res.data && res.data.rows && res.data.rows.length) {
+      const tempData = res.data.rows.filter((item: { isAlarm: string }) => item.isAlarm === '1') || []
+      if (tempData.length) {
+        console.log('处理初始化时报警点数据')
+        const url = `${window.localStorage.getItem('BaseUrl')}/static/${tempData[0].patrolPicture}`
+        const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+        firstData = {
+          ...currentDevice.value,
+          ...routeInfo,
+          ...tempData[0],
+          picture: !tempData[0].patrolPicture ? '' : url,
+          patrolTypeName: tempData[0].patrolType ? approvalLogTypeMap.value[tempData[0].patrolType] : tempData[0].patrolType,
+        }
+        mapRef.value.createAlarmMarkers(firstData) // 绘制报警点
+      }
+    }
+  })
+}
+
 // -------------------------------------------------设备相关-------------------------------------------------
 // 根据设备区查询当前巡检路线
-const fetchRouteByDog = (id: string) => {
+function fetchRouteByDog(id: string) {
   getRouteByDog({ id }).then((res) => {
-    currentDevice.value.routeId = res.data[0].id // 正在执行路线id
-    fetchRouteLog()
+    if (res && res.data && res.data.length) {
+      currentDevice.value.routeId = res.data[0].id // 正在执行路线id
+      currentDevice.value.route = res.data[0].id // 正在执行路线id
+      fetchRouteLog()
+      fetchAlarm()
+    }
+    else {
+      currentDevice.value.routeId = ''
+      currentDevice.value.route = ''
+    }
   })
 }
 
@@ -163,7 +207,6 @@
 }
 // ----------------------------------------------巡检路线----------------------------------------------------------------
 const routeList: any = ref([]) // 巡检路线列表
-const routePointsList: any = ref([]) // 巡检路线列表
 // 获取路线列表
 const fetchRouteList = async () => {
   const params = {
@@ -177,30 +220,75 @@
   const res = await getRouteList(params)
   if (res && res.data && res.data.rows && res.data.rows.length) {
     routeList.value = res.data.rows
-    currentDevice.value.route = routeList.value[0].id
   }
 }
 
 // 监听巡检路线变化
 watch(() => currentDevice.value.route, (newValue) => {
-  const index = routeList.value.findIndex((item: { id: string }) => item.id === newValue)
-  if (index !== -1) {
-    if (routeList.value[index].routeInfoDetailList && Array.isArray(routeList.value[index].routeInfoDetailList) && routeList.value[index].routeInfoDetailList.length) {
-      routePointsList.value = routeList.value[index].routeInfoDetailList.map((item: any) => {
-        return {
-          ...item,
-          ...routeList.value[index],
-        }
-      })
-      console.log('切换的路线的信息：', routePointsList.value)
+  console.log('监听巡检路线变化', newValue)
+  if (newValue) {
+    tableHeight.value = 500
+    const index = routeList.value.findIndex((item: { id: string }) => item.id === newValue)
+    if (index !== -1) {
+      if (routeList.value[index].routeInfoDetailList && Array.isArray(routeList.value[index].routeInfoDetailList) && routeList.value[index].routeInfoDetailList.length) {
+        routePointsList.value = routeList.value[index].routeInfoDetailList.map((item: any) => {
+          return {
+            ...item,
+            ...routeList.value[index],
+          }
+        })
+        console.log('切换的路线的信息：', routePointsList.value)
+      }
+      else {
+        mapRef.value.removeMarkerLayer()
+        console.log('找不到路线信息', routeList.value[index])
+      }
     }
-    else {
-      mapRef.value.removeMarkerLayer()
-      console.log('找不到路线信息', routeList.value[index])
-    }
+  }
+  else {
+    mapRef.value.removeMarkerLayer() // 清除marker图层
+    mapRef.value.closeAlarmInfoWindow()
+    mapRef.value.removeAlarmLayer() // 清除报警图层
+    list.value = []
+    tableHeight.value = 100
+    total.value = list.value.length
   }
 }, { immediate: true })
 // ---------------------------------------图片-----------------------------------------------------------------------
+// 开发自测报警消警，之后删除
+const testByDtt = () => {
+  const url = `${window.localStorage.getItem('BaseUrl')}/static/2025-03\\357e9697b69e4857a8d77d2cf5246a8e.png`
+  const newVal = {
+    gps_x: '116.796975',
+    gps_y: '39.790889',
+    isAlarm: '1',
+    patrolContent: '燃气泄漏',
+    patrolType: '10011',
+    picture: url,
+    routeInfoId: '1',
+    routeNumber: '5',
+    type: 'AI',
+  }
+
+  if (newVal.patrolType === '10011') {
+    if (newVal.isAlarm === '0') {
+      console.log('消警消警消警消警')
+      mapRef.value.closeAlarmInfoWindow()
+      mapRef.value.removeAlarmLayer()
+    }
+    else if (newVal.isAlarm === '1') {
+      console.log('报警报警报警报警')
+      const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+      const params = {
+        ...routeInfo,
+        ...newVal,
+        gpsX: newVal.gps_x,
+        gpsY: newVal.gps_y,
+      }
+      mapRef.value.createAlarmMarkers(params) // 绘制报警点
+    }
+  }
+}
 watch(() => socket.data, (newVal: any) => {
   // 监听到新的巡检情况
   if (newVal && newVal.type === 'AI') { // 报警推送
@@ -208,7 +296,7 @@
     if (currentDevice.value.robotCode === newVal.devcode) { // 找到当前查看的狗
       // =========================查询巡检路线==========================
       // const index = routeList.value.findIndex((item: { id: string }) => item.id === newVal.routeInfoId)
-      const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}}`
+      const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}`
       list.value.shift({
         ...newVal,
         picture: url,
@@ -216,9 +304,28 @@
         createTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), // 时间
       })
       // patrolType === 10011代表燃气泄漏，如果isAlarm为1则需要再地图上打点，并弹框显示信息，
-      // 如果isAlarm为0，如果已经打点且
+      // 如果isAlarm为0，隐藏报警信息窗口
       if (newVal.patrolType === '10011') {
-        //
+        if (newVal.isAlarm === '0') {
+          console.log('执行消警')
+          proxy.$stopAudio()
+          mapRef.value.closeAlarmInfoWindow()
+          mapRef.value.removeAlarmLayer()
+        }
+        else if (newVal.isAlarm === '1') {
+          console.log('执行报警')
+          proxy.$playAudio()
+          const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}`
+          const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+          const params = {
+            ...routeInfo,
+            ...newVal,
+            gpsX: newVal.gps_x,
+            gpsY: newVal.gps_y,
+            picture: url,
+          }
+          mapRef.value.createAlarmMarkers(params) // 绘制报警点
+        }
       }
     }
   }
@@ -347,12 +454,29 @@
   })
 })
 
+function handle(type: string) {
+  if (type === '1') {
+    proxy.$playAudio()
+  }
+  else if (type === '0') {
+    proxy.$stopAudio()
+  }
+}
 onBeforeUnmount(() => {
   destroyVideo() // 销毁实时视频
 })
 </script>
 
 <template>
+  <!-- <button @click="testByDtt">
+    推送报警
+  </button> -->
+  <!-- <button @click="handle('1')">
+    播放音频
+  </button>
+  <button @click="handle('0')">
+    停止音频
+  </button> -->
   <app-container>
     <div class="patrol-manage">
       <div class="box box-top">
@@ -403,7 +527,7 @@
                   巡检路线:
                 </div>
                 <!-- <span class="text">{{ currentDevice.route }}</span> -->
-                <el-select v-model="currentDevice.route" style="width: 160px;" disabled>
+                <el-select v-model="currentDevice.route" placeholder=" " style="width: 160px;" disabled>
                   <el-option
                     v-for="item in routeList"
                     :key="item.id"
@@ -433,7 +557,7 @@
             :pagination="true"
             :columns="columns"
             :query="listQuery"
-            :height="500"
+            :height="tableHeight"
             :list-loading="listLoading"
             @change="changePage"
           >
@@ -520,7 +644,9 @@
         <!-- 实时视频模块 -->
         <div style="display: flex;justify-content: space-around;overflow: auto;">
           <div v-loading="dogVideoLoading">
-            <h5 class="inspection-title">巡检精灵</h5>
+            <h5 class="inspection-title">
+              巡检精灵
+            </h5>
             <video
               id="dog-video-container"
               autoplay
@@ -531,7 +657,9 @@
             />
           </div>
           <div v-loading="armVideoLoading" style="margin-left: 20px;">
-            <h5 class="inspection-title">机械臂</h5>
+            <h5 class="inspection-title">
+              机械臂
+            </h5>
             <video
               id="arm-video-container"
               autoplay
@@ -545,6 +673,7 @@
       </div>
     </div>
   </app-container>
+  <change-device-dialog ref="changeDeviceDialogRef" @confirm="confirmChangeDevice" />
 </template>
 
 <style scoped lang="scss">

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]
diff --git a/src/views/device/deviceManage/deviceManage-interface.ts b/src/views/device/deviceManage/deviceManage-interface.ts
new file mode 100644
index 0000000..22bb34a
--- /dev/null
+++ b/src/views/device/deviceManage/deviceManage-interface.ts
@@ -0,0 +1,32 @@
+// 列表查询
+export interface IListQuery {
+  robotCode: string // 设备编号
+  robotName: string // 设备名称
+  limit: number
+  offset: number
+}
+
+// 表格数据
+export interface IList {
+  id: string //	主键
+  robotCode: string //	机器狗编号
+  robotCell: string //	电量
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: number //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
+
+export interface IForm {
+  id: string //	主键
+  robotCell: string //	电量
+  robotCode: string //	机器狗编号
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: string //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
diff --git a/src/views/device/deviceManage/editDialog.vue b/src/views/device/deviceManage/editDialog.vue
new file mode 100644
index 0000000..5dc16d4
--- /dev/null
+++ b/src/views/device/deviceManage/editDialog.vue
@@ -0,0 +1,188 @@
+<!-- 新增、编辑设备 -->
+<script lang="ts" setup name="DeviceManageEdit">
+import { reactive, ref } from 'vue'
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
+import { addDevice, editDevice } from '@/api/device/deviceManage'
+import { isIp, isPort } from '@/utils/validate'
+const emits = defineEmits(['closeRefresh'])
+const dialogStatus = ref('add')
+const dialogVisible = ref(false) // 弹窗显示隐藏
+// 显示标题
+const textMap: { [key: string]: string } = {
+  detail: '详情',
+  edit: '编辑',
+  add: '新增',
+}
+
+// 表单数据对象
+const formData = ref({
+  id: '', //	主键
+  robotCode: '', //	设备编号
+  robotIp: '', //	设备ip
+  robotName: '', //	设备名称
+  robotPort: '', //	设备端口
+  // robotCell: '', //	电量
+  // robotStatus: '', //	设备状态(1,在线，离线)
+  // routeId: '', // 正在执行路线id
+  // valid: '', //	删除状态(1,有效，0无效)
+})
+const btnLoading = ref(false) // 保存按钮加载状态
+const formDataRef = ref<FormInstance>() // 表单对象
+
+const validateIp = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('ip必填'))
+  }
+  else if (!isIp(value)) {
+    callback(new Error('请输入正确的ip'))
+  }
+  else {
+    callback()
+  }
+}
+
+const validatePort = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('端口必填'))
+  }
+  else if (!isPort(value)) {
+    callback(new Error('请输入正确的端口'))
+  }
+  else {
+    callback()
+  }
+}
+// 校验规则
+const rules = reactive<FormRules>({
+  robotCode: [{ required: true, message: '设备编号必填', trigger: ['blur', 'change'] }],
+  robotName: [{ required: true, message: '设备名称必填', trigger: ['blur', 'change'] }],
+  robotIp: [{ required: true, validator: validateIp, trigger: ['blur', 'change'] }],
+  robotPort: [{ required: true, validator: validatePort, trigger: ['blur', 'change'] }],
+})
+
+// -------------------------------------------------------------------------------------------
+// 表单提交
+function submitForm() {
+  // return ElMessage.info('敬请期待')
+  if (formDataRef.value) {
+    formDataRef.value?.validate((valid: boolean) => {
+      if (valid) {
+        const params = {
+          ...formData.value,
+        }
+        if (dialogStatus.value === 'add') { // 新建
+          addDevice(params).then((res) => {
+            ElMessage.success('新增成功')
+            closeRefresh()
+          })
+        }
+        else if (dialogStatus.value === 'edit') { // 编辑
+          editDevice(params).then((res) => {
+            ElMessage.success('编辑成功')
+            closeRefresh()
+          })
+        }
+      }
+    })
+  }
+}
+
+// 重置表单
+function resetForm() {
+  formData.value = {
+    id: '', //	主键
+    robotCode: '', //	设备编号
+    robotIp: '', //	设备ip
+    robotName: '', //	设备名称
+    robotPort: '', //	设备端口
+    // robotCell: '', //	电量
+    // robotStatus: '', //	设备状态(1,在线，离线)
+    // routeId: '', // 正在执行路线id
+    // valid: '', //	删除状态(1,有效，0无效)
+  }
+}
+// -----------------------------------初始化、关闭对话框相关-----------------------------------------
+function initDialog(dialogstatus: string, row: any) {
+  dialogVisible.value = true
+  if (dialogstatus === 'edit' || dialogstatus === 'detail') {
+    formData.value.id = row.id
+    formData.value.robotCode = row.robotCode //	设备编号
+    formData.value.robotIp = row.robotIp //	设备ip
+    formData.value.robotName = row.robotName //	设备名称
+    formData.value.robotPort = row.robotPort //	设备端口
+    // formData.value.robotCell = '' //	电量
+    // formData.value.robotStatus = '' //	设备状态(1在线，离线)
+    // formData.value.routeId = '' // 正在执行路线id
+    // formData.value.valid = '' //	删除状态(1,有效，0无效)
+  }
+
+  // 详情隐藏表单校验
+  if (dialogstatus === 'detail') {
+    formDataRef.value?.clearValidate()
+  }
+  dialogStatus.value = dialogstatus // 类型 新建add 编辑edit 详情detail
+  btnLoading.value = false
+}
+
+// 关闭并刷新
+function closeRefresh() {
+  dialogVisible.value = false
+  resetForm()
+  if (formDataRef.value) {
+    formDataRef.value?.clearValidate()
+  }
+  emits('closeRefresh')
+}
+
+// ----------------------- 以下是暴露的方法内容 ----------------------------
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog
+    v-model="dialogVisible" :title="textMap[dialogStatus]" width="600" :before-close="closeRefresh" append-to-body
+    :open-delay="0" :close-on-click-modal="false"
+  >
+    <el-form
+      ref="formDataRef" :model="formData" :rules="rules" label-position="right" label-width="130px"
+      class="form-container" size="default" :disabled="dialogStatus === 'detail'" @submit.prevent
+    >
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form-item label="设备编号" prop="robotCode">
+            <el-input v-model="formData.robotCode" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="设备名称" prop="robotName">
+            <el-input v-model="formData.robotName" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="ip" prop="robotIp">
+            <el-input v-model="formData.robotIp" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="端口" prop="robotPort">
+            <el-input v-model="formData.robotPort" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button v-if="dialogStatus !== 'detail'" :loading="btnLoading" type="primary" @click="submitForm">
+          保存
+        </el-button>
+        <el-button @click="closeRefresh">
+          取消
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+//
+</style>
diff --git a/src/views/device/deviceManage/list.vue b/src/views/device/deviceManage/list.vue
new file mode 100644
index 0000000..582073a
--- /dev/null
+++ b/src/views/device/deviceManage/list.vue
@@ -0,0 +1,155 @@
+<!-- 设备管理 -->
+<script lang="ts" setup name="DeviceManageList">
+import type { Ref } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { IList, IListQuery } from './deviceManage-interface'
+import editDialog from './editDialog.vue'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { deleteDevice, getDeviceList } from '@/api/device/deviceManage'
+const { proxy } = getCurrentInstance() as any
+const router = useRouter()
+const fileRef = ref() // 文件上传input
+const editDialogRef = ref()
+const loading = ref(false)
+// ------------------------------------------------------------------------------------------
+// 默认查询条件
+const listQuery: Ref<IListQuery> = ref({
+  robotCode: '', // 设备编号
+  robotName: '', // 设备名称
+  offset: 1,
+  limit: 20,
+})
+// ------------------------------------------表格---------------------------------------------
+const columns: TableColumn[] = [
+  { text: '设备编号', value: 'robotCode', align: 'center' },
+  { text: '设备名称', value: 'robotName', align: 'center' },
+  { text: 'IP', value: 'robotIp', align: 'center' },
+  { text: '端口', value: 'robotPort', align: 'center' },
+  { text: '状态', value: 'robotStatusName', width: '90', align: 'center', styleFilter: (row: IList) => { return row.robotStatus == '1' ? 'color: #1aa034' : 'red' } },
+  { text: '电量', value: 'robotCell', align: 'center' },
+]
+const total = ref(0) // 数据条数
+const list: any = ref([]) // 数据条数
+const checkoutList = ref([]) // 数据条数
+
+// 查询数据
+const fetchData = () => {
+  loading.value = true
+  getDeviceList(listQuery.value).then((res: { data: { rows: []; total: number } }) => {
+    list.value = res.data.rows.map((item: IList) => {
+      return {
+        ...item,
+        robotCell: `${item.robotCell}` ? `${item.robotCell}%` : item.robotCell, // 电量
+        robotStatusName: `${item.robotStatus}` === '1' ? '在线' : '离线', // 设备状态
+      }
+    })
+    total.value = res.data.total
+    loading.value = false
+  })
+  loading.value = false
+}
+
+// 搜索重置
+const reset = () => {
+  listQuery.value = {
+    robotCode: '', // 设备编号
+    robotName: '', // 设备名称
+    offset: 1,
+    limit: 20,
+  }
+  fetchData()
+}
+
+// 搜索按钮
+function search() {
+  fetchData()
+}
+
+// 新增
+const add = () => {
+  editDialogRef.value.initDialog('add')
+}
+// 详情
+const detail = (row: IList) => {
+  editDialogRef.value.initDialog('detail', row)
+}
+// 编辑
+const edit = (row: IList) => {
+  editDialogRef.value.initDialog('edit', row)
+}
+// 删除
+const del = (row: IList) => {
+  ElMessageBox.confirm(
+    '确定删除吗？',
+    '确认删除',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  ).then(() => {
+    deleteDevice({ ids: [row.id] }).then(() => {
+      ElMessage.success('删除成功')
+      fetchData()
+    })
+  })
+}
+
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+function changePage(val: { size: number; page: number }) {
+  if (val && val.size) {
+    listQuery.value.limit = val.size
+  }
+  if (val && val.page) {
+    listQuery.value.offset = val.page
+  }
+  fetchData()
+}
+
+onMounted(async () => {
+  fetchData()
+})
+</script>
+
+<template>
+  <app-container>
+    <search-area :need-clear="true" @search="search" @clear="reset">
+      <search-item>
+        <el-input v-model.trim="listQuery.robotCode" placeholder="设备编号" clearable />
+      </search-item>
+      <search-item>
+        <el-input v-model.trim="listQuery.robotName" placeholder="设备名称" clearable />
+      </search-item>
+    </search-area>
+    <table-container>
+      <template #btns-right>
+        <icon-button icon="icon-add" title="新增" @click="add" />
+      </template>
+      <normal-table :query="listQuery" :list-loading="loading" :columns="columns" :data="list" :total="total" :border="false" @change="changePage">
+        <template #preColumns>
+          <el-table-column label="序号" width="55" align="center">
+            <template #default="scope">
+              {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+        </template>
+        <template #columns>
+          <el-table-column label="操作" width="150" align="center">
+            <template #default="scope">
+              <el-button type="primary" link size="small" class="table-text-button" @click="detail(scope.row)">
+                详情
+              </el-button>
+              <el-button type="primary" link size="small" class="table-text-button" @click="edit(scope.row)">
+                编辑
+              </el-button>
+              <el-button type="danger" link size="small" class="table-text-button" @click="del(scope.row)">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </template>
+      </normal-table>
+    </table-container>
+    <edit-dialog ref="editDialogRef" @close-refresh="search" />
+  </app-container>
+</template>
diff --git a/src/views/patrol/manage/index.vue b/src/views/patrol/manage/index.vue
index fadf39b..3670322 100644
--- a/src/views/patrol/manage/index.vue
+++ b/src/views/patrol/manage/index.vue
@@ -11,11 +11,14 @@
 import { getDictByCode } from '@/api/system/dict'
 import useSocket from '@/store/modules/websocket'
 import { getDeviceList, getRouteLog } from '@/api/patrol/manage'
+import changeDeviceDialog from '@/views/patrol/navigation/dialog/changeDeviceDialog.vue'
 import { controlDevice, delRoute, getRouteByDog, getRouteList } from '@/api/patrol/navigation'
+const { proxy } = getCurrentInstance() as any
 const socket = useSocket()
 const mapRef = ref() // 地图组件
+const tableHeight = ref(500) // 表格高度
 const currentDevice: any = ref({
-  id: '',
+  id: '', // 当前设备id
   robotName: '--', // 设备名称
   robotCode: '--', // 设备编号
   robotStatus: '--', // 1,有效，0无效
@@ -26,19 +29,23 @@
   name: '--', // 小区名称
   address: '--', // 小区地址
 })
+const routePointsList: any = ref([]) // 巡检路线列表
+
+// -----------------------------------------更换、解除设备----------------------------------------
+const changeDeviceDialogRef = ref()
 // 点击更换设备
 const changeDevice = () => {
-  ElMessageBox.confirm(
-    '确定更换设备吗？',
-    '提示',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-  ).then(() => {
-    ElMessage.info('敬请期待')
-  })
+  changeDeviceDialogRef.value.initDialog(currentDevice.value.id)
+}
+
+// 确认更换设备
+const confirmChangeDevice = (value: any) => {
+  currentDevice.value.id = value[0].id
+  currentDevice.value.robotName = value[0].robotName // 设备名称
+  currentDevice.value.robotCode = value[0].robotCode // 设备编号
+  currentDevice.value.robotStatus = `${value[0].robotStatus}` === '1' ? '工作中' : '离线' // 1,有效，0无效
+  currentDevice.value.robotCell = `${value[0].robotCell}` ? `${value[0].robotCell}%` : '--' // 电量
+  fetchRouteByDog(currentDevice.value.id) // 根据设备区查询当前巡检路线
 }
 
 // 点击解除绑定
@@ -73,7 +80,7 @@
 const columns: any = ref([
   { text: '巡检内容', value: 'patrolTypeName', align: 'center' },
   { text: '巡检情况', value: 'patrolContent', align: 'center' },
-  { text: '甲烷浓度(ppm.m)', value: 'situation', align: 'center' },
+  { text: '甲烷浓度(ppm.m)', value: 'gas', align: 'center' },
   { text: '时间', value: 'createTime', align: 'center' },
 ])
 const listQuery = ref({
@@ -113,12 +120,49 @@
   fetchRouteLog()
 }
 
+// 刚进入页面查询第一个燃气报警点，并在图上绘制出来
+function fetchAlarm() {
+  const params = {
+    routeInfoId: '',
+    limit: 99999,
+    offset: 1,
+    patrolType: '10011',
+  }
+  getRouteLog(params).then((res) => {
+    let firstData = []
+    if (res && res.data && res.data.rows && res.data.rows.length) {
+      const tempData = res.data.rows.filter((item: { isAlarm: string }) => item.isAlarm === '1') || []
+      if (tempData.length) {
+        console.log('处理初始化时报警点数据')
+        const url = `${window.localStorage.getItem('BaseUrl')}/static/${tempData[0].patrolPicture}`
+        const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+        firstData = {
+          ...currentDevice.value,
+          ...routeInfo,
+          ...tempData[0],
+          picture: !tempData[0].patrolPicture ? '' : url,
+          patrolTypeName: tempData[0].patrolType ? approvalLogTypeMap.value[tempData[0].patrolType] : tempData[0].patrolType,
+        }
+        mapRef.value.createAlarmMarkers(firstData) // 绘制报警点
+      }
+    }
+  })
+}
+
 // -------------------------------------------------设备相关-------------------------------------------------
 // 根据设备区查询当前巡检路线
-const fetchRouteByDog = (id: string) => {
+function fetchRouteByDog(id: string) {
   getRouteByDog({ id }).then((res) => {
-    currentDevice.value.routeId = res.data[0].id // 正在执行路线id
-    fetchRouteLog()
+    if (res && res.data && res.data.length) {
+      currentDevice.value.routeId = res.data[0].id // 正在执行路线id
+      currentDevice.value.route = res.data[0].id // 正在执行路线id
+      fetchRouteLog()
+      fetchAlarm()
+    }
+    else {
+      currentDevice.value.routeId = ''
+      currentDevice.value.route = ''
+    }
   })
 }
 
@@ -163,7 +207,6 @@
 }
 // ----------------------------------------------巡检路线----------------------------------------------------------------
 const routeList: any = ref([]) // 巡检路线列表
-const routePointsList: any = ref([]) // 巡检路线列表
 // 获取路线列表
 const fetchRouteList = async () => {
   const params = {
@@ -177,30 +220,75 @@
   const res = await getRouteList(params)
   if (res && res.data && res.data.rows && res.data.rows.length) {
     routeList.value = res.data.rows
-    currentDevice.value.route = routeList.value[0].id
   }
 }
 
 // 监听巡检路线变化
 watch(() => currentDevice.value.route, (newValue) => {
-  const index = routeList.value.findIndex((item: { id: string }) => item.id === newValue)
-  if (index !== -1) {
-    if (routeList.value[index].routeInfoDetailList && Array.isArray(routeList.value[index].routeInfoDetailList) && routeList.value[index].routeInfoDetailList.length) {
-      routePointsList.value = routeList.value[index].routeInfoDetailList.map((item: any) => {
-        return {
-          ...item,
-          ...routeList.value[index],
-        }
-      })
-      console.log('切换的路线的信息：', routePointsList.value)
+  console.log('监听巡检路线变化', newValue)
+  if (newValue) {
+    tableHeight.value = 500
+    const index = routeList.value.findIndex((item: { id: string }) => item.id === newValue)
+    if (index !== -1) {
+      if (routeList.value[index].routeInfoDetailList && Array.isArray(routeList.value[index].routeInfoDetailList) && routeList.value[index].routeInfoDetailList.length) {
+        routePointsList.value = routeList.value[index].routeInfoDetailList.map((item: any) => {
+          return {
+            ...item,
+            ...routeList.value[index],
+          }
+        })
+        console.log('切换的路线的信息：', routePointsList.value)
+      }
+      else {
+        mapRef.value.removeMarkerLayer()
+        console.log('找不到路线信息', routeList.value[index])
+      }
     }
-    else {
-      mapRef.value.removeMarkerLayer()
-      console.log('找不到路线信息', routeList.value[index])
-    }
+  }
+  else {
+    mapRef.value.removeMarkerLayer() // 清除marker图层
+    mapRef.value.closeAlarmInfoWindow()
+    mapRef.value.removeAlarmLayer() // 清除报警图层
+    list.value = []
+    tableHeight.value = 100
+    total.value = list.value.length
   }
 }, { immediate: true })
 // ---------------------------------------图片-----------------------------------------------------------------------
+// 开发自测报警消警，之后删除
+const testByDtt = () => {
+  const url = `${window.localStorage.getItem('BaseUrl')}/static/2025-03\\357e9697b69e4857a8d77d2cf5246a8e.png`
+  const newVal = {
+    gps_x: '116.796975',
+    gps_y: '39.790889',
+    isAlarm: '1',
+    patrolContent: '燃气泄漏',
+    patrolType: '10011',
+    picture: url,
+    routeInfoId: '1',
+    routeNumber: '5',
+    type: 'AI',
+  }
+
+  if (newVal.patrolType === '10011') {
+    if (newVal.isAlarm === '0') {
+      console.log('消警消警消警消警')
+      mapRef.value.closeAlarmInfoWindow()
+      mapRef.value.removeAlarmLayer()
+    }
+    else if (newVal.isAlarm === '1') {
+      console.log('报警报警报警报警')
+      const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+      const params = {
+        ...routeInfo,
+        ...newVal,
+        gpsX: newVal.gps_x,
+        gpsY: newVal.gps_y,
+      }
+      mapRef.value.createAlarmMarkers(params) // 绘制报警点
+    }
+  }
+}
 watch(() => socket.data, (newVal: any) => {
   // 监听到新的巡检情况
   if (newVal && newVal.type === 'AI') { // 报警推送
@@ -208,7 +296,7 @@
     if (currentDevice.value.robotCode === newVal.devcode) { // 找到当前查看的狗
       // =========================查询巡检路线==========================
       // const index = routeList.value.findIndex((item: { id: string }) => item.id === newVal.routeInfoId)
-      const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}}`
+      const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}`
       list.value.shift({
         ...newVal,
         picture: url,
@@ -216,9 +304,28 @@
         createTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), // 时间
       })
       // patrolType === 10011代表燃气泄漏，如果isAlarm为1则需要再地图上打点，并弹框显示信息，
-      // 如果isAlarm为0，如果已经打点且
+      // 如果isAlarm为0，隐藏报警信息窗口
       if (newVal.patrolType === '10011') {
-        //
+        if (newVal.isAlarm === '0') {
+          console.log('执行消警')
+          proxy.$stopAudio()
+          mapRef.value.closeAlarmInfoWindow()
+          mapRef.value.removeAlarmLayer()
+        }
+        else if (newVal.isAlarm === '1') {
+          console.log('执行报警')
+          proxy.$playAudio()
+          const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}`
+          const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+          const params = {
+            ...routeInfo,
+            ...newVal,
+            gpsX: newVal.gps_x,
+            gpsY: newVal.gps_y,
+            picture: url,
+          }
+          mapRef.value.createAlarmMarkers(params) // 绘制报警点
+        }
       }
     }
   }
@@ -347,12 +454,29 @@
   })
 })
 
+function handle(type: string) {
+  if (type === '1') {
+    proxy.$playAudio()
+  }
+  else if (type === '0') {
+    proxy.$stopAudio()
+  }
+}
 onBeforeUnmount(() => {
   destroyVideo() // 销毁实时视频
 })
 </script>
 
 <template>
+  <!-- <button @click="testByDtt">
+    推送报警
+  </button> -->
+  <!-- <button @click="handle('1')">
+    播放音频
+  </button>
+  <button @click="handle('0')">
+    停止音频
+  </button> -->
   <app-container>
     <div class="patrol-manage">
       <div class="box box-top">
@@ -403,7 +527,7 @@
                   巡检路线:
                 </div>
                 <!-- <span class="text">{{ currentDevice.route }}</span> -->
-                <el-select v-model="currentDevice.route" style="width: 160px;" disabled>
+                <el-select v-model="currentDevice.route" placeholder=" " style="width: 160px;" disabled>
                   <el-option
                     v-for="item in routeList"
                     :key="item.id"
@@ -433,7 +557,7 @@
             :pagination="true"
             :columns="columns"
             :query="listQuery"
-            :height="500"
+            :height="tableHeight"
             :list-loading="listLoading"
             @change="changePage"
           >
@@ -520,7 +644,9 @@
         <!-- 实时视频模块 -->
         <div style="display: flex;justify-content: space-around;overflow: auto;">
           <div v-loading="dogVideoLoading">
-            <h5 class="inspection-title">巡检精灵</h5>
+            <h5 class="inspection-title">
+              巡检精灵
+            </h5>
             <video
               id="dog-video-container"
               autoplay
@@ -531,7 +657,9 @@
             />
           </div>
           <div v-loading="armVideoLoading" style="margin-left: 20px;">
-            <h5 class="inspection-title">机械臂</h5>
+            <h5 class="inspection-title">
+              机械臂
+            </h5>
             <video
               id="arm-video-container"
               autoplay
@@ -545,6 +673,7 @@
       </div>
     </div>
   </app-container>
+  <change-device-dialog ref="changeDeviceDialogRef" @confirm="confirmChangeDevice" />
 </template>
 
 <style scoped lang="scss">
diff --git a/src/views/patrol/navigation/dialog/changeDeviceDialog.vue b/src/views/patrol/navigation/dialog/changeDeviceDialog.vue
new file mode 100644
index 0000000..e872c90
--- /dev/null
+++ b/src/views/patrol/navigation/dialog/changeDeviceDialog.vue
@@ -0,0 +1,159 @@
+<!-- 选择设备 -->
+<script lang="ts" setup name="ChangeDeviceDialog">
+import { ElMessage } from 'element-plus'
+import type { Ref } from 'vue'
+import dayjs from 'dayjs'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { SCHEDULE } from '@/utils/scheduleDict'
+import { deleteDevice, getDeviceList } from '@/api/device/deviceManage'
+import type { IList, IListQuery } from '@/views/device/deviceManage/deviceManage-interface'
+const emits = defineEmits(['confirm'])
+const dialogFormVisible = ref(false)
+// 查询条件
+const listQuery: Ref<IListQuery> = ref({
+  robotCode: '', // 设备编号
+  robotName: '', // 设备名称
+  offset: 1,
+  limit: 20,
+})
+// 多选选中的内容
+const checkoutList = ref([])
+const currentDeviceId = ref('')
+const loadingTable = ref<boolean>(false)
+const list = ref<IList[]>([]) // 表格数据
+const total = ref<number>(0)
+const columns = ref<TableColumn[]>([
+  { text: '设备编号', value: 'robotCode', align: 'center' },
+  { text: '设备名称', value: 'robotName', align: 'center' },
+  { text: 'IP', value: 'robotIp', align: 'center' },
+  { text: '端口', value: 'robotPort', align: 'center' },
+  { text: '状态', value: 'robotStatusName', width: '90', align: 'center', styleFilter: (row: IList) => { return row.robotStatus == '1' ? 'color: #1aa034' : 'red' } },
+  { text: '电量', value: 'robotCell', align: 'center' },
+])
+
+// 数据查询
+function fetchData(isNowPage = false) {
+  loadingTable.value = true
+  if (!isNowPage) {
+    // 是否显示当前页，否则跳转第一页
+    listQuery.value.offset = 1
+  }
+  // 模拟数据
+  getDeviceList(listQuery.value).then((res: { data: { rows: []; total: number } }) => {
+    list.value = res.data.rows.map((item: IList) => {
+      return {
+        ...item,
+        robotCell: `${item.robotCell}` ? `${item.robotCell}%` : item.robotCell, // 电量
+        robotStatusName: `${item.robotStatus}` === '1' ? '在线' : '离线', // 设备状态
+      }
+    })
+    total.value = res.data.total
+    loadingTable.value = false
+  })
+}
+// 重置
+const reset = () => {
+  listQuery.value = {
+    robotCode: '', // 设备编号
+    robotName: '', // 设备名称
+    offset: 1,
+    limit: 20,
+  }
+  fetchData()
+}
+// 搜索
+const search = () => {
+  fetchData(true)
+}
+// 多选选中
+const handleSelectionChange = (val: any) => {
+  checkoutList.value = val
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number;page?: number }) => {
+  if (val && val.size) {
+    listQuery.value.limit = val.size
+  }
+  if (val && val.page) {
+    listQuery.value.offset = val.page
+  }
+  search()
+}
+// 点击确定
+const confirmSelect = () => {
+  if (!checkoutList.value.length) {
+    ElMessage.warning('请选择设备')
+  }
+  else {
+    emits('confirm', checkoutList.value)
+    dialogFormVisible.value = false
+  }
+}
+// 取消
+const resetForm = () => {
+  dialogFormVisible.value = false
+  reset()
+}
+// 初始化
+const initDialog = (deviceId = '') => {
+  currentDeviceId.value = deviceId
+  dialogFormVisible.value = true
+  fetchData()
+}
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog v-if="dialogFormVisible" v-model="dialogFormVisible" title="选择设备" width="65%">
+    <!-- 筛选条件 -->
+    <search-area :need-clear="true" @search="search" @clear="reset">
+      <search-item>
+        <el-input v-model.trim="listQuery.robotCode" placeholder="设备编号" clearable />
+      </search-item>
+      <search-item>
+        <el-input v-model.trim="listQuery.robotName" placeholder="设备名称" clearable />
+      </search-item>
+    </search-area>
+
+    <!-- 查询结果Table显示 -->
+    <div style="padding: 12px;">
+      <normal-table
+        :data="list"
+        :total="total"
+        :columns="columns"
+        :query="listQuery"
+        is-showmulti-select
+        :list-loading="loadingTable"
+        :is-multi="false"
+        :defaultSingleChecked="currentDeviceId"
+        :height="360"
+        :page-sizes="[20]"
+        @change="changePage"
+        @multiSelect="handleSelectionChange"
+      >
+        <!-- 序号 -->
+        <template #preColumns>
+          <el-table-column label="#" width="55" align="center" fixed>
+            <template #default="scope">
+              {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+        </template>
+      </normal-table>
+    </div>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="confirmSelect">确认</el-button>
+        <el-button @click="resetForm">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+:deep(.el-radio__label) {
+  display: none;
+}
+</style>

diff --git a/src/api/device/deviceManage.ts b/src/api/device/deviceManage.ts
new file mode 100644
index 0000000..298a756
--- /dev/null
+++ b/src/api/device/deviceManage.ts
@@ -0,0 +1,49 @@
+/**
+ * 设备管理接口
+ */
+import request from '@/api/index'
+
+// 设备列表
+export function getDeviceList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/listPage',
+    method: 'post',
+    data,
+  })
+}
+
+// 获取设备下拉列表
+export function selectDogList(data: { robotName: string }) {
+  return request({
+    url: '/system/robotDogInfo/selectDogList',
+    method: 'post',
+    data,
+  })
+}
+
+// 新增设备
+export function addDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/add',
+    method: 'post',
+    data,
+  })
+}
+
+// 编辑设备
+export function editDevice(data: any) {
+  return request({
+    url: '/system/robotDogInfo/edit',
+    method: 'post',
+    data,
+  })
+}
+
+// 批量删除
+export function deleteDevice(data: { ids: string[] }) {
+  return request({
+    url: '/system/robotDogInfo/batchDelete',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/assets/audio/alarm1.mp3 b/src/assets/audio/alarm1.mp3
new file mode 100644
index 0000000..8be6dcf
--- /dev/null
+++ b/src/assets/audio/alarm1.mp3
Binary files differ
diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3
new file mode 100644
index 0000000..6ec901f
--- /dev/null
+++ b/src/assets/audio/other.mp3
Binary files differ
diff --git a/src/assets/marker/alarm.png b/src/assets/marker/alarm.png
new file mode 100644
index 0000000..dd75d3d
--- /dev/null
+++ b/src/assets/marker/alarm.png
Binary files differ
diff --git a/src/components/NormalTable/index.vue b/src/components/NormalTable/index.vue
index bf0b007..5fcb9f7 100644
--- a/src/components/NormalTable/index.vue
+++ b/src/components/NormalTable/index.vue
@@ -98,6 +98,11 @@
     type: Boolean,
     default: false,
   },
+  // 单选默认选中
+  defaultSingleChecked: {
+    type: String,
+    default: '',
+  },
 })
 const emit = defineEmits(['change', 'selectionChange', 'rowClick', 'rowDbClick', 'multiSelect', 'filterChange', 'rowDisabled', 'handleClickFollowLink'])
 // -------定义数据--------------
@@ -193,7 +198,7 @@
   clearMulti,
   // initColumnsState,
   table,
-  setScrollLeft
+  setScrollLeft,
 })
 // onBeforeMount(() => {
 //   initColumnsState()
@@ -321,6 +326,13 @@
   }
   clickIndex.value = -1
 }
+
+watch(() => props.defaultSingleChecked, (newValue) => {
+  console.log('监听到单选选中id：', newValue)
+  if (newValue) {
+    singleChecked.value = newValue
+  }
+}, { immediate: true })
 </script>
 
 <template>
diff --git a/src/components/aMap/index.vue b/src/components/aMap/index.vue
index c2284dc..f8aec49 100644
--- a/src/components/aMap/index.vue
+++ b/src/components/aMap/index.vue
@@ -3,6 +3,7 @@
 import AMapLoader from '@amap/amap-jsapi-loader'
 import dogUrl from '../../assets/tempImages/dog.png'
 import markerUrl from '../../assets/marker/marker.png'
+import alarmUrl from '../../assets/marker/alarm.png'
 const props = defineProps({
   patrolInfoList: Array as any,
 })
@@ -11,10 +12,12 @@
 
 const mapContainer = ref<HTMLDivElement | null>(null)
 const map: any = ref(null) // 地图实例
-const markerLayer = ref<AMap.OverlayGroup | null>(null)
-const dogLayer = ref<AMap.OverlayGroup | null>(null)
+const markerLayer = ref<AMap.OverlayGroup | null>(null) // 巡检路线点图层
+const dogLayer = ref<AMap.OverlayGroup | null>(null) // 狗实时位置图层
+const alarmLayer = ref<AMap.OverlayGroup | null>(null) // 报警点图层
 const dogMarker = ref<AMap.Marker | null>(null)
 const dogMarkerPosition = ref() // 狗的当前位置
+const markersList: any = ref([])
 // 初始化地图
 const initMap = async () => {
   if (!mapContainer.value) { return }
@@ -49,19 +52,26 @@
 }
 
 // ----------------------------------------marker-----------------------------------------------
+const markerInfoWindow = ref() // marker信息窗口
+// 关闭报警信息窗口
+function closeMarkerInfoWindow() {
+  if (markerInfoWindow.value) {
+    markerInfoWindow.value.close()
+  }
+}
 // 移除标记图层
 const removeMarkerLayer = () => {
   if (map.value && markerLayer.value) {
     map.value.remove(markerLayer.value)
     markerLayer.value = null
   }
+  closeMarkerInfoWindow()
 }
 
 // 创建巡航点标记
 const createMarkers = () => {
   if (!map.value) { return }
   removeMarkerLayer()
-  const markers: AMap.Marker[] = []
   // 创建marker图层
   if (!markerLayer.value) {
     markerLayer.value = new AMap.OverlayGroup()
@@ -78,24 +88,6 @@
     else {
       labelText = `${index + 1}`
     }
-
-    // 自定义标记内容
-    // const markerContent = `
-    //   <div class="custom-marker" style="
-    //     width: 30px;
-    //     height: 30px;
-    //     background-color: #0d76d4;
-    //     border-radius: 50%;
-    //     color: white;
-    //     text-align: center;
-    //     line-height: 30px;
-    //     box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
-    //     transition: transform 0.3s ease;
-    //   ">
-    //     ${labelText}
-    //   </div>
-    // `
-
     const markerContent = `
     <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
         <img src="${markerUrl}" style="width: 100%; height: 100%; object-fit: cover;">
@@ -121,18 +113,17 @@
       content,
       offset: new AMap.Pixel(0, -30),
     })
-
+    markerInfoWindow.value = infoWindow
     // 绑定点击事件，点击 marker 显示 InfoWindow
     marker.on('click', () => {
       infoWindow.open(map.value, marker.getPosition())
     })
     // map.value.setView(cruisePoints.value[cruisePoints.value.length - 1].point)
-    markers.push(marker)
+    markersList.value.push(marker)
     markerLayer.value.addOverlay(marker)
-    map.value.setFitView(markers)
+    map.value.setFitView(markersList.value)
   })
-  map.value.add(markerLayer)
-  return markers
+  map.value.add(markerLayer.value)
 }
 
 // 创建连线
@@ -161,7 +152,7 @@
   map.value.add(markerLayer.value)
 }
 
-// --------------------------------------------dog------------------------------------------------
+// --------------------------------------------dog图层------------------------------------------------
 // 移除狗图层
 const removeDogLayer = () => {
   if (map.value && dogLayer.value) {
@@ -211,6 +202,95 @@
     dogMarkerPosition.value = endPoint
   }
 }
+// --------------------------------------------报警点图层------------------------------------------------
+const alarmInfoWindow = ref() // 报警信息窗口
+// 创建报警点图层
+const createAlarmLayer = () => {
+  if (!alarmLayer.value) {
+    alarmLayer.value = new AMap.OverlayGroup()
+    map.value.add(alarmLayer.value)
+  }
+}
+// 移除报警点图层
+const removeAlarmLayer = () => {
+  if (map.value && alarmLayer.value) {
+    map.value.remove(alarmLayer.value)
+    alarmLayer.value = null
+  }
+  closeAlarmInfoWindow()
+}
+
+// 绘制报警点
+const createAlarmMarkers = (pointInfo: any) => {
+  if (!map.value) { return }
+  removeAlarmLayer()
+  createAlarmLayer()
+  const alarmPoint = [pointInfo.gpsX, pointInfo.gpsY]
+  const alarmMarkerContent = `
+    <div style="width: 40px; height: 40px; position: relative; display: flex; justify-content: center;">
+        <img src="${alarmUrl}" style="width: 100%; height: 100%; object-fit: cover;">
+    </div>
+    `
+
+  const alarmMarker = new AMap.Marker({
+    position: alarmPoint,
+    content: alarmMarkerContent,
+    offset: new AMap.Pixel(-15, -15), // 调整标记的偏移量，使其居中显示
+  })
+  const contentNoImg = '<div style="font-size: 16px;padding: 6px"> <div style="font-weight: bold;padding-bottom: 10px; color: #d81e06">报警信息</div>'
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>`
+        + `<div style="font-size: 14px;padding-bottom: 6px"><label style="font-weight: bold;padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>`
+        + '</div>'
+
+  const contentImg = `
+    <div style="font-size: 16px; padding: 6px; display: flex;">
+        <div style="width: 300px;">
+            <div style="white-space: noWrap;font-weight: bold; padding-bottom: 10px; color: #d81e06">报警信息</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区名称：</label>${pointInfo.communityName}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">小区地址：</label>${pointInfo.communityAddress}</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">点位编号：</label>${pointInfo.routeNumber}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">巡检内容：</label>${pointInfo.patrolContent}</div>
+            <div style="font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">甲烷浓度：</label>${pointInfo.gas}ppm.m</div>
+            <div style="white-space: noWrap;font-size: 14px; padding-bottom: 6px"><label style="font-weight: bold; padding-right: 16px">位ㅤㅤ置：</label>${pointInfo.gpsX}, ${pointInfo.gpsY}</div>
+        </div>
+        <div style="margin-left: 10px;flex: 1; display: flex; justify-content: center; align-items: center;">
+          <img src="${pointInfo.picture}" style="width: 300px; height: 200px;" alt="报警图片">
+        </div>
+    </div>
+  `
+
+  const content = pointInfo.picture ? contentImg : contentNoImg
+  // 创建 InfoWindow 并设置内容
+  const infoWindow = new AMap.InfoWindow({
+    content,
+    offset: new AMap.Pixel(0, -30),
+  })
+  alarmInfoWindow.value = infoWindow
+  infoWindow.open(map.value, alarmMarker.getPosition()) // 自动打开InfoWindow
+
+  // 绑定点击事件，点击 marker 显示
+  alarmMarker.on('click', () => {
+    infoWindow.open(map.value, alarmMarker.getPosition())
+  })
+  alarmLayer.value.addOverlay(alarmMarker)
+  map.value.setCenter(alarmPoint)
+  map.value.setZoom(17) // 设置合适的缩放级别
+  map.value.add(alarmLayer.value)
+}
+
+// 关闭报警信息窗口
+function closeAlarmInfoWindow() {
+  if (alarmInfoWindow.value) {
+    alarmInfoWindow.value.close()
+    if (markersList.value.length && map.value) {
+      map.value.setFitView(markersList.value)
+    }
+  }
+}
 // -----------------------------------------------------------------------------------------------
 
 watch(() => props.patrolInfoList, async (newVal) => {
@@ -234,7 +314,16 @@
   await initMap()
 })
 // ----------------------- 以下是暴露的方法内容 ----------------------------
-defineExpose({ createMarkers, createPolylines, removeMarkerLayer, createDogMarker, startMoving })
+defineExpose({
+  createMarkers,
+  createPolylines,
+  removeMarkerLayer,
+  createDogMarker,
+  startMoving,
+  createAlarmMarkers,
+  closeAlarmInfoWindow, // 关闭报警信息窗口
+  removeAlarmLayer, // 移除报警图层
+})
 </script>
 
 <template>
diff --git a/src/main.ts b/src/main.ts
index 513faee..ebb33d7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -11,11 +11,11 @@
 import request from '@/api/index'
 import indexDB from '@/utils/indexDB'
 import '@/utils/getLocation'
+// 引入音频文件
+import alarmAudio from '@/assets/audio/alarm1.mp3'
 // 自定义指令
 import { dragHeight } from '@/directives/drag-height/index'
 import { dragWidth } from '@/directives/drag-width/index'
-// 引入音频文件
-// import alarmAudio from '@/assets/audio/alarm.mp3'
 // 自定义指令
 import directive from '@/utils/directive'
 // 加载 svg 图标
@@ -29,7 +29,10 @@
 if (useSettingsStore().app.iconifyOfflineUse) {
   downloadAndInstall()
 }
-
+// 引入音频文件
+const audio = new Audio(alarmAudio)
+// 设置音频循环播放
+audio.loop = true
 axios
   .get('./config/config.json', {
     headers: {
@@ -77,37 +80,18 @@
       })
 
     // ============================音频===========================
-    // 方法1：注册播放音频事件到Vue实例上
-    // app.config.globalProperties.playAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   audio.setAttribute('src', alarmAudio)
-    //   audio.loop = true
-    //   if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.load()
-    //   }
-    //   else { // 否则
-    //     // audio.pause()
-    //     setTimeout(() => {
-    //       // audio.play()
-    //       const playPromise = audio.load()
-    //       if (playPromise) {
-    //         playPromise.then(() => {
-    //           // 音频加载成功
-    //           console.log('音频加载成功')
-    //         }).catch((e) => {
-    //           // 音频加载失败
-    //           console.error(e.message)
-    //         })
-    //       }
-    //     }, 10)
-    //   }
-    // }
-    // app.config.globalProperties.pauseAudio = () => {
-    //   const audio = document.getElementById('eventAudio') as HTMLAudioElement
-    //   if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
-    //     audio.pause()
-    //   }
-    // }
+    // 注册全局播放音频事件
+    app.config.globalProperties.$playAudio = () => {
+      audio.play().catch((error) => {
+        console.error('播放音频时出错:', error)
+      })
+    }
+
+    // 注册全局停止播放音频事件
+    app.config.globalProperties.$stopAudio = () => {
+      audio.pause()
+      audio.currentTime = 0
+    }
     // ============================音频===========================
     // app.use(print)
     app.use(ElementPlus)
diff --git a/src/router/modules/device.ts b/src/router/modules/device.ts
new file mode 100644
index 0000000..b9df3b4
--- /dev/null
+++ b/src/router/modules/device.ts
@@ -0,0 +1,34 @@
+// 设备管理
+import type { Route } from '@/global'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: Route.recordRaw[] = [
+  {
+    path: '/device',
+    component: Layout,
+    redirect: '/device/list',
+    name: 'Device',
+    meta: {
+      title: '设备管理',
+      icon: 'ep:key',
+      auth: '/device',
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'DeviceManageList',
+        component: () => import('@/views/device/deviceManage/list.vue'),
+        meta: {
+          title: '设备管理',
+          auth: '/device/deviceManage',
+          sidebar: true,
+          breadcrumb: true,
+          activeMenu: '/device',
+        },
+      },
+    ],
+  },
+]
+
+export default routes
diff --git a/src/router/modules/menus.ts b/src/router/modules/menus.ts
index af35115..be5f9ac 100644
--- a/src/router/modules/menus.ts
+++ b/src/router/modules/menus.ts
@@ -1,6 +1,7 @@
 // 所有菜单路由
 import systemRoutes from './system'
 import patrolRoutes from './patrol'
+import deviceRoutes from './device'
 import type { Route } from '@/global'
 const Layout = () => import('@/layouts/index.vue')
 
@@ -34,6 +35,8 @@
   },
   // 巡检管理
   ...patrolRoutes,
+  // 设备管理
+  ...deviceRoutes,
   // 系统路由
   ...systemRoutes,
 ]
diff --git a/src/views/device/deviceManage/deviceManage-interface.ts b/src/views/device/deviceManage/deviceManage-interface.ts
new file mode 100644
index 0000000..22bb34a
--- /dev/null
+++ b/src/views/device/deviceManage/deviceManage-interface.ts
@@ -0,0 +1,32 @@
+// 列表查询
+export interface IListQuery {
+  robotCode: string // 设备编号
+  robotName: string // 设备名称
+  limit: number
+  offset: number
+}
+
+// 表格数据
+export interface IList {
+  id: string //	主键
+  robotCode: string //	机器狗编号
+  robotCell: string //	电量
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: number //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
+
+export interface IForm {
+  id: string //	主键
+  robotCell: string //	电量
+  robotCode: string //	机器狗编号
+  robotIp: string //	机器狗ip
+  robotName: string //	机器狗名称
+  robotPort: string //	机器狗端口
+  robotStatus: string //	机器狗状态(1,在线，离线)
+  routeId: string // 正在执行路线id
+  valid: string //	删除状态(1,有效，0无效)
+}
diff --git a/src/views/device/deviceManage/editDialog.vue b/src/views/device/deviceManage/editDialog.vue
new file mode 100644
index 0000000..5dc16d4
--- /dev/null
+++ b/src/views/device/deviceManage/editDialog.vue
@@ -0,0 +1,188 @@
+<!-- 新增、编辑设备 -->
+<script lang="ts" setup name="DeviceManageEdit">
+import { reactive, ref } from 'vue'
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
+import { addDevice, editDevice } from '@/api/device/deviceManage'
+import { isIp, isPort } from '@/utils/validate'
+const emits = defineEmits(['closeRefresh'])
+const dialogStatus = ref('add')
+const dialogVisible = ref(false) // 弹窗显示隐藏
+// 显示标题
+const textMap: { [key: string]: string } = {
+  detail: '详情',
+  edit: '编辑',
+  add: '新增',
+}
+
+// 表单数据对象
+const formData = ref({
+  id: '', //	主键
+  robotCode: '', //	设备编号
+  robotIp: '', //	设备ip
+  robotName: '', //	设备名称
+  robotPort: '', //	设备端口
+  // robotCell: '', //	电量
+  // robotStatus: '', //	设备状态(1,在线，离线)
+  // routeId: '', // 正在执行路线id
+  // valid: '', //	删除状态(1,有效，0无效)
+})
+const btnLoading = ref(false) // 保存按钮加载状态
+const formDataRef = ref<FormInstance>() // 表单对象
+
+const validateIp = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('ip必填'))
+  }
+  else if (!isIp(value)) {
+    callback(new Error('请输入正确的ip'))
+  }
+  else {
+    callback()
+  }
+}
+
+const validatePort = (rule: any, value: any, callback: any) => {
+  if (value === '') {
+    callback(new Error('端口必填'))
+  }
+  else if (!isPort(value)) {
+    callback(new Error('请输入正确的端口'))
+  }
+  else {
+    callback()
+  }
+}
+// 校验规则
+const rules = reactive<FormRules>({
+  robotCode: [{ required: true, message: '设备编号必填', trigger: ['blur', 'change'] }],
+  robotName: [{ required: true, message: '设备名称必填', trigger: ['blur', 'change'] }],
+  robotIp: [{ required: true, validator: validateIp, trigger: ['blur', 'change'] }],
+  robotPort: [{ required: true, validator: validatePort, trigger: ['blur', 'change'] }],
+})
+
+// -------------------------------------------------------------------------------------------
+// 表单提交
+function submitForm() {
+  // return ElMessage.info('敬请期待')
+  if (formDataRef.value) {
+    formDataRef.value?.validate((valid: boolean) => {
+      if (valid) {
+        const params = {
+          ...formData.value,
+        }
+        if (dialogStatus.value === 'add') { // 新建
+          addDevice(params).then((res) => {
+            ElMessage.success('新增成功')
+            closeRefresh()
+          })
+        }
+        else if (dialogStatus.value === 'edit') { // 编辑
+          editDevice(params).then((res) => {
+            ElMessage.success('编辑成功')
+            closeRefresh()
+          })
+        }
+      }
+    })
+  }
+}
+
+// 重置表单
+function resetForm() {
+  formData.value = {
+    id: '', //	主键
+    robotCode: '', //	设备编号
+    robotIp: '', //	设备ip
+    robotName: '', //	设备名称
+    robotPort: '', //	设备端口
+    // robotCell: '', //	电量
+    // robotStatus: '', //	设备状态(1,在线，离线)
+    // routeId: '', // 正在执行路线id
+    // valid: '', //	删除状态(1,有效，0无效)
+  }
+}
+// -----------------------------------初始化、关闭对话框相关-----------------------------------------
+function initDialog(dialogstatus: string, row: any) {
+  dialogVisible.value = true
+  if (dialogstatus === 'edit' || dialogstatus === 'detail') {
+    formData.value.id = row.id
+    formData.value.robotCode = row.robotCode //	设备编号
+    formData.value.robotIp = row.robotIp //	设备ip
+    formData.value.robotName = row.robotName //	设备名称
+    formData.value.robotPort = row.robotPort //	设备端口
+    // formData.value.robotCell = '' //	电量
+    // formData.value.robotStatus = '' //	设备状态(1在线，离线)
+    // formData.value.routeId = '' // 正在执行路线id
+    // formData.value.valid = '' //	删除状态(1,有效，0无效)
+  }
+
+  // 详情隐藏表单校验
+  if (dialogstatus === 'detail') {
+    formDataRef.value?.clearValidate()
+  }
+  dialogStatus.value = dialogstatus // 类型 新建add 编辑edit 详情detail
+  btnLoading.value = false
+}
+
+// 关闭并刷新
+function closeRefresh() {
+  dialogVisible.value = false
+  resetForm()
+  if (formDataRef.value) {
+    formDataRef.value?.clearValidate()
+  }
+  emits('closeRefresh')
+}
+
+// ----------------------- 以下是暴露的方法内容 ----------------------------
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog
+    v-model="dialogVisible" :title="textMap[dialogStatus]" width="600" :before-close="closeRefresh" append-to-body
+    :open-delay="0" :close-on-click-modal="false"
+  >
+    <el-form
+      ref="formDataRef" :model="formData" :rules="rules" label-position="right" label-width="130px"
+      class="form-container" size="default" :disabled="dialogStatus === 'detail'" @submit.prevent
+    >
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form-item label="设备编号" prop="robotCode">
+            <el-input v-model="formData.robotCode" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="设备名称" prop="robotName">
+            <el-input v-model="formData.robotName" :disabled="dialogStatus === 'detail'" :maxlength="100" show-word-limit autosize type="textarea" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="ip" prop="robotIp">
+            <el-input v-model="formData.robotIp" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="端口" prop="robotPort">
+            <el-input v-model="formData.robotPort" :disabled="dialogStatus === 'detail'" placeholder="必填" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button v-if="dialogStatus !== 'detail'" :loading="btnLoading" type="primary" @click="submitForm">
+          保存
+        </el-button>
+        <el-button @click="closeRefresh">
+          取消
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+//
+</style>
diff --git a/src/views/device/deviceManage/list.vue b/src/views/device/deviceManage/list.vue
new file mode 100644
index 0000000..582073a
--- /dev/null
+++ b/src/views/device/deviceManage/list.vue
@@ -0,0 +1,155 @@
+<!-- 设备管理 -->
+<script lang="ts" setup name="DeviceManageList">
+import type { Ref } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { IList, IListQuery } from './deviceManage-interface'
+import editDialog from './editDialog.vue'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { deleteDevice, getDeviceList } from '@/api/device/deviceManage'
+const { proxy } = getCurrentInstance() as any
+const router = useRouter()
+const fileRef = ref() // 文件上传input
+const editDialogRef = ref()
+const loading = ref(false)
+// ------------------------------------------------------------------------------------------
+// 默认查询条件
+const listQuery: Ref<IListQuery> = ref({
+  robotCode: '', // 设备编号
+  robotName: '', // 设备名称
+  offset: 1,
+  limit: 20,
+})
+// ------------------------------------------表格---------------------------------------------
+const columns: TableColumn[] = [
+  { text: '设备编号', value: 'robotCode', align: 'center' },
+  { text: '设备名称', value: 'robotName', align: 'center' },
+  { text: 'IP', value: 'robotIp', align: 'center' },
+  { text: '端口', value: 'robotPort', align: 'center' },
+  { text: '状态', value: 'robotStatusName', width: '90', align: 'center', styleFilter: (row: IList) => { return row.robotStatus == '1' ? 'color: #1aa034' : 'red' } },
+  { text: '电量', value: 'robotCell', align: 'center' },
+]
+const total = ref(0) // 数据条数
+const list: any = ref([]) // 数据条数
+const checkoutList = ref([]) // 数据条数
+
+// 查询数据
+const fetchData = () => {
+  loading.value = true
+  getDeviceList(listQuery.value).then((res: { data: { rows: []; total: number } }) => {
+    list.value = res.data.rows.map((item: IList) => {
+      return {
+        ...item,
+        robotCell: `${item.robotCell}` ? `${item.robotCell}%` : item.robotCell, // 电量
+        robotStatusName: `${item.robotStatus}` === '1' ? '在线' : '离线', // 设备状态
+      }
+    })
+    total.value = res.data.total
+    loading.value = false
+  })
+  loading.value = false
+}
+
+// 搜索重置
+const reset = () => {
+  listQuery.value = {
+    robotCode: '', // 设备编号
+    robotName: '', // 设备名称
+    offset: 1,
+    limit: 20,
+  }
+  fetchData()
+}
+
+// 搜索按钮
+function search() {
+  fetchData()
+}
+
+// 新增
+const add = () => {
+  editDialogRef.value.initDialog('add')
+}
+// 详情
+const detail = (row: IList) => {
+  editDialogRef.value.initDialog('detail', row)
+}
+// 编辑
+const edit = (row: IList) => {
+  editDialogRef.value.initDialog('edit', row)
+}
+// 删除
+const del = (row: IList) => {
+  ElMessageBox.confirm(
+    '确定删除吗？',
+    '确认删除',
+    {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  ).then(() => {
+    deleteDevice({ ids: [row.id] }).then(() => {
+      ElMessage.success('删除成功')
+      fetchData()
+    })
+  })
+}
+
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+function changePage(val: { size: number; page: number }) {
+  if (val && val.size) {
+    listQuery.value.limit = val.size
+  }
+  if (val && val.page) {
+    listQuery.value.offset = val.page
+  }
+  fetchData()
+}
+
+onMounted(async () => {
+  fetchData()
+})
+</script>
+
+<template>
+  <app-container>
+    <search-area :need-clear="true" @search="search" @clear="reset">
+      <search-item>
+        <el-input v-model.trim="listQuery.robotCode" placeholder="设备编号" clearable />
+      </search-item>
+      <search-item>
+        <el-input v-model.trim="listQuery.robotName" placeholder="设备名称" clearable />
+      </search-item>
+    </search-area>
+    <table-container>
+      <template #btns-right>
+        <icon-button icon="icon-add" title="新增" @click="add" />
+      </template>
+      <normal-table :query="listQuery" :list-loading="loading" :columns="columns" :data="list" :total="total" :border="false" @change="changePage">
+        <template #preColumns>
+          <el-table-column label="序号" width="55" align="center">
+            <template #default="scope">
+              {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+        </template>
+        <template #columns>
+          <el-table-column label="操作" width="150" align="center">
+            <template #default="scope">
+              <el-button type="primary" link size="small" class="table-text-button" @click="detail(scope.row)">
+                详情
+              </el-button>
+              <el-button type="primary" link size="small" class="table-text-button" @click="edit(scope.row)">
+                编辑
+              </el-button>
+              <el-button type="danger" link size="small" class="table-text-button" @click="del(scope.row)">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </template>
+      </normal-table>
+    </table-container>
+    <edit-dialog ref="editDialogRef" @close-refresh="search" />
+  </app-container>
+</template>
diff --git a/src/views/patrol/manage/index.vue b/src/views/patrol/manage/index.vue
index fadf39b..3670322 100644
--- a/src/views/patrol/manage/index.vue
+++ b/src/views/patrol/manage/index.vue
@@ -11,11 +11,14 @@
 import { getDictByCode } from '@/api/system/dict'
 import useSocket from '@/store/modules/websocket'
 import { getDeviceList, getRouteLog } from '@/api/patrol/manage'
+import changeDeviceDialog from '@/views/patrol/navigation/dialog/changeDeviceDialog.vue'
 import { controlDevice, delRoute, getRouteByDog, getRouteList } from '@/api/patrol/navigation'
+const { proxy } = getCurrentInstance() as any
 const socket = useSocket()
 const mapRef = ref() // 地图组件
+const tableHeight = ref(500) // 表格高度
 const currentDevice: any = ref({
-  id: '',
+  id: '', // 当前设备id
   robotName: '--', // 设备名称
   robotCode: '--', // 设备编号
   robotStatus: '--', // 1,有效，0无效
@@ -26,19 +29,23 @@
   name: '--', // 小区名称
   address: '--', // 小区地址
 })
+const routePointsList: any = ref([]) // 巡检路线列表
+
+// -----------------------------------------更换、解除设备----------------------------------------
+const changeDeviceDialogRef = ref()
 // 点击更换设备
 const changeDevice = () => {
-  ElMessageBox.confirm(
-    '确定更换设备吗？',
-    '提示',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-  ).then(() => {
-    ElMessage.info('敬请期待')
-  })
+  changeDeviceDialogRef.value.initDialog(currentDevice.value.id)
+}
+
+// 确认更换设备
+const confirmChangeDevice = (value: any) => {
+  currentDevice.value.id = value[0].id
+  currentDevice.value.robotName = value[0].robotName // 设备名称
+  currentDevice.value.robotCode = value[0].robotCode // 设备编号
+  currentDevice.value.robotStatus = `${value[0].robotStatus}` === '1' ? '工作中' : '离线' // 1,有效，0无效
+  currentDevice.value.robotCell = `${value[0].robotCell}` ? `${value[0].robotCell}%` : '--' // 电量
+  fetchRouteByDog(currentDevice.value.id) // 根据设备区查询当前巡检路线
 }
 
 // 点击解除绑定
@@ -73,7 +80,7 @@
 const columns: any = ref([
   { text: '巡检内容', value: 'patrolTypeName', align: 'center' },
   { text: '巡检情况', value: 'patrolContent', align: 'center' },
-  { text: '甲烷浓度(ppm.m)', value: 'situation', align: 'center' },
+  { text: '甲烷浓度(ppm.m)', value: 'gas', align: 'center' },
   { text: '时间', value: 'createTime', align: 'center' },
 ])
 const listQuery = ref({
@@ -113,12 +120,49 @@
   fetchRouteLog()
 }
 
+// 刚进入页面查询第一个燃气报警点，并在图上绘制出来
+function fetchAlarm() {
+  const params = {
+    routeInfoId: '',
+    limit: 99999,
+    offset: 1,
+    patrolType: '10011',
+  }
+  getRouteLog(params).then((res) => {
+    let firstData = []
+    if (res && res.data && res.data.rows && res.data.rows.length) {
+      const tempData = res.data.rows.filter((item: { isAlarm: string }) => item.isAlarm === '1') || []
+      if (tempData.length) {
+        console.log('处理初始化时报警点数据')
+        const url = `${window.localStorage.getItem('BaseUrl')}/static/${tempData[0].patrolPicture}`
+        const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+        firstData = {
+          ...currentDevice.value,
+          ...routeInfo,
+          ...tempData[0],
+          picture: !tempData[0].patrolPicture ? '' : url,
+          patrolTypeName: tempData[0].patrolType ? approvalLogTypeMap.value[tempData[0].patrolType] : tempData[0].patrolType,
+        }
+        mapRef.value.createAlarmMarkers(firstData) // 绘制报警点
+      }
+    }
+  })
+}
+
 // -------------------------------------------------设备相关-------------------------------------------------
 // 根据设备区查询当前巡检路线
-const fetchRouteByDog = (id: string) => {
+function fetchRouteByDog(id: string) {
   getRouteByDog({ id }).then((res) => {
-    currentDevice.value.routeId = res.data[0].id // 正在执行路线id
-    fetchRouteLog()
+    if (res && res.data && res.data.length) {
+      currentDevice.value.routeId = res.data[0].id // 正在执行路线id
+      currentDevice.value.route = res.data[0].id // 正在执行路线id
+      fetchRouteLog()
+      fetchAlarm()
+    }
+    else {
+      currentDevice.value.routeId = ''
+      currentDevice.value.route = ''
+    }
   })
 }
 
@@ -163,7 +207,6 @@
 }
 // ----------------------------------------------巡检路线----------------------------------------------------------------
 const routeList: any = ref([]) // 巡检路线列表
-const routePointsList: any = ref([]) // 巡检路线列表
 // 获取路线列表
 const fetchRouteList = async () => {
   const params = {
@@ -177,30 +220,75 @@
   const res = await getRouteList(params)
   if (res && res.data && res.data.rows && res.data.rows.length) {
     routeList.value = res.data.rows
-    currentDevice.value.route = routeList.value[0].id
   }
 }
 
 // 监听巡检路线变化
 watch(() => currentDevice.value.route, (newValue) => {
-  const index = routeList.value.findIndex((item: { id: string }) => item.id === newValue)
-  if (index !== -1) {
-    if (routeList.value[index].routeInfoDetailList && Array.isArray(routeList.value[index].routeInfoDetailList) && routeList.value[index].routeInfoDetailList.length) {
-      routePointsList.value = routeList.value[index].routeInfoDetailList.map((item: any) => {
-        return {
-          ...item,
-          ...routeList.value[index],
-        }
-      })
-      console.log('切换的路线的信息：', routePointsList.value)
+  console.log('监听巡检路线变化', newValue)
+  if (newValue) {
+    tableHeight.value = 500
+    const index = routeList.value.findIndex((item: { id: string }) => item.id === newValue)
+    if (index !== -1) {
+      if (routeList.value[index].routeInfoDetailList && Array.isArray(routeList.value[index].routeInfoDetailList) && routeList.value[index].routeInfoDetailList.length) {
+        routePointsList.value = routeList.value[index].routeInfoDetailList.map((item: any) => {
+          return {
+            ...item,
+            ...routeList.value[index],
+          }
+        })
+        console.log('切换的路线的信息：', routePointsList.value)
+      }
+      else {
+        mapRef.value.removeMarkerLayer()
+        console.log('找不到路线信息', routeList.value[index])
+      }
     }
-    else {
-      mapRef.value.removeMarkerLayer()
-      console.log('找不到路线信息', routeList.value[index])
-    }
+  }
+  else {
+    mapRef.value.removeMarkerLayer() // 清除marker图层
+    mapRef.value.closeAlarmInfoWindow()
+    mapRef.value.removeAlarmLayer() // 清除报警图层
+    list.value = []
+    tableHeight.value = 100
+    total.value = list.value.length
   }
 }, { immediate: true })
 // ---------------------------------------图片-----------------------------------------------------------------------
+// 开发自测报警消警，之后删除
+const testByDtt = () => {
+  const url = `${window.localStorage.getItem('BaseUrl')}/static/2025-03\\357e9697b69e4857a8d77d2cf5246a8e.png`
+  const newVal = {
+    gps_x: '116.796975',
+    gps_y: '39.790889',
+    isAlarm: '1',
+    patrolContent: '燃气泄漏',
+    patrolType: '10011',
+    picture: url,
+    routeInfoId: '1',
+    routeNumber: '5',
+    type: 'AI',
+  }
+
+  if (newVal.patrolType === '10011') {
+    if (newVal.isAlarm === '0') {
+      console.log('消警消警消警消警')
+      mapRef.value.closeAlarmInfoWindow()
+      mapRef.value.removeAlarmLayer()
+    }
+    else if (newVal.isAlarm === '1') {
+      console.log('报警报警报警报警')
+      const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+      const params = {
+        ...routeInfo,
+        ...newVal,
+        gpsX: newVal.gps_x,
+        gpsY: newVal.gps_y,
+      }
+      mapRef.value.createAlarmMarkers(params) // 绘制报警点
+    }
+  }
+}
 watch(() => socket.data, (newVal: any) => {
   // 监听到新的巡检情况
   if (newVal && newVal.type === 'AI') { // 报警推送
@@ -208,7 +296,7 @@
     if (currentDevice.value.robotCode === newVal.devcode) { // 找到当前查看的狗
       // =========================查询巡检路线==========================
       // const index = routeList.value.findIndex((item: { id: string }) => item.id === newVal.routeInfoId)
-      const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}}`
+      const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}`
       list.value.shift({
         ...newVal,
         picture: url,
@@ -216,9 +304,28 @@
         createTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), // 时间
       })
       // patrolType === 10011代表燃气泄漏，如果isAlarm为1则需要再地图上打点，并弹框显示信息，
-      // 如果isAlarm为0，如果已经打点且
+      // 如果isAlarm为0，隐藏报警信息窗口
       if (newVal.patrolType === '10011') {
-        //
+        if (newVal.isAlarm === '0') {
+          console.log('执行消警')
+          proxy.$stopAudio()
+          mapRef.value.closeAlarmInfoWindow()
+          mapRef.value.removeAlarmLayer()
+        }
+        else if (newVal.isAlarm === '1') {
+          console.log('执行报警')
+          proxy.$playAudio()
+          const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}`
+          const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息
+          const params = {
+            ...routeInfo,
+            ...newVal,
+            gpsX: newVal.gps_x,
+            gpsY: newVal.gps_y,
+            picture: url,
+          }
+          mapRef.value.createAlarmMarkers(params) // 绘制报警点
+        }
       }
     }
   }
@@ -347,12 +454,29 @@
   })
 })
 
+function handle(type: string) {
+  if (type === '1') {
+    proxy.$playAudio()
+  }
+  else if (type === '0') {
+    proxy.$stopAudio()
+  }
+}
 onBeforeUnmount(() => {
   destroyVideo() // 销毁实时视频
 })
 </script>
 
 <template>
+  <!-- <button @click="testByDtt">
+    推送报警
+  </button> -->
+  <!-- <button @click="handle('1')">
+    播放音频
+  </button>
+  <button @click="handle('0')">
+    停止音频
+  </button> -->
   <app-container>
     <div class="patrol-manage">
       <div class="box box-top">
@@ -403,7 +527,7 @@
                   巡检路线:
                 </div>
                 <!-- <span class="text">{{ currentDevice.route }}</span> -->
-                <el-select v-model="currentDevice.route" style="width: 160px;" disabled>
+                <el-select v-model="currentDevice.route" placeholder=" " style="width: 160px;" disabled>
                   <el-option
                     v-for="item in routeList"
                     :key="item.id"
@@ -433,7 +557,7 @@
             :pagination="true"
             :columns="columns"
             :query="listQuery"
-            :height="500"
+            :height="tableHeight"
             :list-loading="listLoading"
             @change="changePage"
           >
@@ -520,7 +644,9 @@
         <!-- 实时视频模块 -->
         <div style="display: flex;justify-content: space-around;overflow: auto;">
           <div v-loading="dogVideoLoading">
-            <h5 class="inspection-title">巡检精灵</h5>
+            <h5 class="inspection-title">
+              巡检精灵
+            </h5>
             <video
               id="dog-video-container"
               autoplay
@@ -531,7 +657,9 @@
             />
           </div>
           <div v-loading="armVideoLoading" style="margin-left: 20px;">
-            <h5 class="inspection-title">机械臂</h5>
+            <h5 class="inspection-title">
+              机械臂
+            </h5>
             <video
               id="arm-video-container"
               autoplay
@@ -545,6 +673,7 @@
       </div>
     </div>
   </app-container>
+  <change-device-dialog ref="changeDeviceDialogRef" @confirm="confirmChangeDevice" />
 </template>
 
 <style scoped lang="scss">
diff --git a/src/views/patrol/navigation/dialog/changeDeviceDialog.vue b/src/views/patrol/navigation/dialog/changeDeviceDialog.vue
new file mode 100644
index 0000000..e872c90
--- /dev/null
+++ b/src/views/patrol/navigation/dialog/changeDeviceDialog.vue
@@ -0,0 +1,159 @@
+<!-- 选择设备 -->
+<script lang="ts" setup name="ChangeDeviceDialog">
+import { ElMessage } from 'element-plus'
+import type { Ref } from 'vue'
+import dayjs from 'dayjs'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { SCHEDULE } from '@/utils/scheduleDict'
+import { deleteDevice, getDeviceList } from '@/api/device/deviceManage'
+import type { IList, IListQuery } from '@/views/device/deviceManage/deviceManage-interface'
+const emits = defineEmits(['confirm'])
+const dialogFormVisible = ref(false)
+// 查询条件
+const listQuery: Ref<IListQuery> = ref({
+  robotCode: '', // 设备编号
+  robotName: '', // 设备名称
+  offset: 1,
+  limit: 20,
+})
+// 多选选中的内容
+const checkoutList = ref([])
+const currentDeviceId = ref('')
+const loadingTable = ref<boolean>(false)
+const list = ref<IList[]>([]) // 表格数据
+const total = ref<number>(0)
+const columns = ref<TableColumn[]>([
+  { text: '设备编号', value: 'robotCode', align: 'center' },
+  { text: '设备名称', value: 'robotName', align: 'center' },
+  { text: 'IP', value: 'robotIp', align: 'center' },
+  { text: '端口', value: 'robotPort', align: 'center' },
+  { text: '状态', value: 'robotStatusName', width: '90', align: 'center', styleFilter: (row: IList) => { return row.robotStatus == '1' ? 'color: #1aa034' : 'red' } },
+  { text: '电量', value: 'robotCell', align: 'center' },
+])
+
+// 数据查询
+function fetchData(isNowPage = false) {
+  loadingTable.value = true
+  if (!isNowPage) {
+    // 是否显示当前页，否则跳转第一页
+    listQuery.value.offset = 1
+  }
+  // 模拟数据
+  getDeviceList(listQuery.value).then((res: { data: { rows: []; total: number } }) => {
+    list.value = res.data.rows.map((item: IList) => {
+      return {
+        ...item,
+        robotCell: `${item.robotCell}` ? `${item.robotCell}%` : item.robotCell, // 电量
+        robotStatusName: `${item.robotStatus}` === '1' ? '在线' : '离线', // 设备状态
+      }
+    })
+    total.value = res.data.total
+    loadingTable.value = false
+  })
+}
+// 重置
+const reset = () => {
+  listQuery.value = {
+    robotCode: '', // 设备编号
+    robotName: '', // 设备名称
+    offset: 1,
+    limit: 20,
+  }
+  fetchData()
+}
+// 搜索
+const search = () => {
+  fetchData(true)
+}
+// 多选选中
+const handleSelectionChange = (val: any) => {
+  checkoutList.value = val
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number;page?: number }) => {
+  if (val && val.size) {
+    listQuery.value.limit = val.size
+  }
+  if (val && val.page) {
+    listQuery.value.offset = val.page
+  }
+  search()
+}
+// 点击确定
+const confirmSelect = () => {
+  if (!checkoutList.value.length) {
+    ElMessage.warning('请选择设备')
+  }
+  else {
+    emits('confirm', checkoutList.value)
+    dialogFormVisible.value = false
+  }
+}
+// 取消
+const resetForm = () => {
+  dialogFormVisible.value = false
+  reset()
+}
+// 初始化
+const initDialog = (deviceId = '') => {
+  currentDeviceId.value = deviceId
+  dialogFormVisible.value = true
+  fetchData()
+}
+defineExpose({ initDialog })
+</script>
+
+<template>
+  <el-dialog v-if="dialogFormVisible" v-model="dialogFormVisible" title="选择设备" width="65%">
+    <!-- 筛选条件 -->
+    <search-area :need-clear="true" @search="search" @clear="reset">
+      <search-item>
+        <el-input v-model.trim="listQuery.robotCode" placeholder="设备编号" clearable />
+      </search-item>
+      <search-item>
+        <el-input v-model.trim="listQuery.robotName" placeholder="设备名称" clearable />
+      </search-item>
+    </search-area>
+
+    <!-- 查询结果Table显示 -->
+    <div style="padding: 12px;">
+      <normal-table
+        :data="list"
+        :total="total"
+        :columns="columns"
+        :query="listQuery"
+        is-showmulti-select
+        :list-loading="loadingTable"
+        :is-multi="false"
+        :defaultSingleChecked="currentDeviceId"
+        :height="360"
+        :page-sizes="[20]"
+        @change="changePage"
+        @multiSelect="handleSelectionChange"
+      >
+        <!-- 序号 -->
+        <template #preColumns>
+          <el-table-column label="#" width="55" align="center" fixed>
+            <template #default="scope">
+              {{ (listQuery.offset - 1) * listQuery.limit + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+        </template>
+      </normal-table>
+    </div>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="confirmSelect">确认</el-button>
+        <el-button @click="resetForm">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+:deep(.el-radio__label) {
+  display: none;
+}
+</style>
diff --git a/src/views/patrol/navigation/index.vue b/src/views/patrol/navigation/index.vue
index 0b188a6..1db7e2f 100644
--- a/src/views/patrol/navigation/index.vue
+++ b/src/views/patrol/navigation/index.vue
@@ -5,6 +5,7 @@
 import threeCom from '@/components/threejs/index.vue'
 import { controlDevice, delRoute, getRouteByDog, getRouteList } from '@/api/patrol/navigation'
 import useSocket from '@/store/modules/websocket'
+import changeDeviceDialog from '@/views/patrol/navigation/dialog/changeDeviceDialog.vue'
 import { getDeviceList } from '@/api/patrol/manage'
 const socket = useSocket()
 const currentDevice = ref({ // 当前设备信息
@@ -16,25 +17,27 @@
   routeId: '', // 正在执行路线id
   route: '--',
   speed: '--',
-  name: '--', // 小区名称
-  address: '--', // 小区地址
+  communityName: '--', // 小区名称
+  communityAddress: '--', // 小区地址
 })
 
-const btnStatusMap = ref('') // 按钮状态
 const routeInfoDetailList: any = ref([]) // 巡检路线的点的集合
+// -----------------------------------------更换、解除设备----------------------------------------
+const changeDeviceDialogRef = ref()
 // 点击更换设备
 const changeDevice = () => {
-  ElMessageBox.confirm(
-    '确定更换设备吗？',
-    '提示',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-  ).then(() => {
-    ElMessage.info('敬请期待')
-  })
+  changeDeviceDialogRef.value.initDialog(currentDevice.value.id)
+}
+
+// 确认更换设备
+const confirmChangeDevice = (value: any) => {
+  currentDevice.value.id = value[0].id
+  currentDevice.value.robotName = value[0].robotName // 设备名称
+  currentDevice.value.robotCode = value[0].robotCode // 设备编号
+  currentDevice.value.robotStatus = `${value[0].robotStatus}` === '1' ? '工作中' : '离线' // 1,有效，0无效
+  currentDevice.value.robotCell = `${value[0].robotCell}` ? `${value[0].robotCell}%` : '--' // 电量
+  fetchRouteByDog(currentDevice.value.id) // 根据设备区查询当前巡检路线
+  fetchRouteList() // 查询巡检路线
 }
 
 // 点击解除绑定
@@ -67,6 +70,7 @@
   communityName: '', //		小区名称
   robotName: '', //		机器人名称
   routeName: '', //		巡航线名称
+  robotId: '', //	狗id
   limit: 10,
   offset: 1,
 })
@@ -74,8 +78,9 @@
 const listLoading = ref(false)
 const total = ref(0)
 // 获取路线列表
-const fetchRouteList = () => {
+function fetchRouteList() {
   listLoading.value = true
+  listQuery.value.robotId = currentDevice.value.id
   getRouteList(listQuery.value).then((res) => {
     list.value = res.data.rows.map((item: { updateTime: string; createTime: string }) => {
       return {
@@ -85,6 +90,15 @@
     })
     total.value = res.data.total
     listLoading.value = false
+    // 小区信息默认最新的路线的信息
+    if (list.value.length) {
+      currentDevice.value.communityName = list.value[0].communityName // 小区名称
+      currentDevice.value.communityAddress = list.value[0].communityAddress // 小区地址
+    }
+    else {
+      currentDevice.value.communityName = '--' // 小区名称
+      currentDevice.value.communityAddress = '--' // 小区地址
+    }
   }).catch(() => { listLoading.value = false })
 }
 
@@ -160,9 +174,16 @@
 }
 // -------------------------------------------------设备相关-------------------------------------------------
 // 根据设备区查询当前巡检路线
-const fetchRouteByDog = (id: string) => {
+function fetchRouteByDog(id: string) {
   getRouteByDog({ id }).then((res) => {
-    currentDevice.value.routeId = res.data[0].id // 正在执行路线id
+    if (res && res.data && res.data.length) {
+      currentDevice.value.routeId = res.data[0].id // 正在执行路线id
+      currentDevice.value.route = res.data[0].id // 正在执行路线id
+    }
+    else {
+      currentDevice.value.routeId = ''
+      currentDevice.value.route = ''
+    }
   })
 }
 
@@ -203,8 +224,8 @@
       situation: '现场周边无施工现象',
       picture: '',
       route: '路线1',
-      name: '二街坊社区',
-      address: '北京市海淀区永定路街道',
+      communityName: '二街坊社区',
+      communityAddress: '北京市海淀区永定路街道',
       robotName: '机器狗1号',
       updateTime: '2025-03-10 14:42:00',
     },
@@ -213,8 +234,8 @@
       situation: '正常',
       picture: '',
       route: '路线2',
-      name: '永定路57号院',
-      address: '北京市海淀区永定路街道',
+      communityName: '永定路57号院',
+      communityAddress: '北京市海淀区永定路街道',
       robotName: '机器狗2号',
       updateTime: '2025-03-10 10:00:00',
     },
@@ -287,7 +308,8 @@
               </span>
               <span>
                 <span class="title">设备状态: </span>
-                <span class="text" style="color: #afcc85">{{ currentDevice.robotStatus }}</span>
+                <!-- <span class="text" style="color: #afcc85">{{ currentDevice.robotStatus }}</span> -->
+                <span class="text" :style="{ color: `${currentDevice.robotStatus}` === '工作中' ? '#afcc85' : '#ccc' }">{{ currentDevice.robotStatus }}</span>
               </span>
               <span>
                 <span class="title">设备电量: </span>
@@ -295,11 +317,11 @@
               </span>
               <span>
                 <span class="title">小区名称: </span>
-                <span class="text">{{ currentDevice.name }}</span>
+                <span class="text">{{ currentDevice.communityName }}</span>
               </span>
               <span>
                 <span class="title">小区地址: </span>
-                <span class="text">{{ currentDevice.address }}</span>
+                <span class="text">{{ currentDevice.communityAddress }}</span>
               </span>
             </div>
           </div>
@@ -362,6 +384,7 @@
     </div>
   </app-container>
   <add-route-dialog ref="addRouteDialogRef" @close-refresh="fetchRouteList()" />
+  <change-device-dialog ref="changeDeviceDialogRef" @confirm="confirmChangeDevice" />
 </template>
 
 <style scoped lang="scss">