From 0b23ae04bb3c18a2fc0991dfb79eeb2bb99c0a4e Mon Sep 17 00:00:00 2001
From: renna <576157508@qq.com>
Date: Mon, 9 Jun 2025 12:05:24 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E5=AE=8C=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/detail.js                          |  18 ++
 src/assets/img/empty_robot.png             | Bin 0 -> 11235 bytes
 src/components/RobotStatusList.vue         |  57 +++++-
 src/components/common/CustomSelect.vue     |   7 +-
 src/components/common/TitleBlock.vue       |   2 +-
 src/components/dialog/AlarmDetailModal.vue |  12 +-
 src/components/dialog/ConfirmDialog.vue    |   8 +-
 src/components/dialog/EventDetailModal.vue | 194 +++++++++++++++------
 src/views/Home.vue                         |  46 +++--
 src/views/RobotDetail.vue                  | 120 +++++++++++--
 10 files changed, 365 insertions(+), 99 deletions(-)
 create mode 100644 src/assets/img/empty_robot.png

diff --git a/src/api/detail.js b/src/api/detail.js
index d9f4294..2cc4dfe 100644
--- a/src/api/detail.js
+++ b/src/api/detail.js
@@ -102,6 +102,24 @@ export const robotApi = {
             url: `/api/v1/events/alertFront/${messageId}`,
             method: 'get',
         })
+    },
+    // 查看全部告警事件接口
+    getAlarmEventList: (number) => {
+        return service({
+            url: `/api/v1/events/getAllAlertMessage/${number}`,
+            method: 'get',
+        })
+    },
+    // 查看全部告警事件接口（支持分页）
+    getAlarmDetailList: (params) => {
+        return service({
+            url: `/api/v1/events/getAllAlertMessage/${params.number}`,
+            method: 'get',
+            params: {
+                offset: params.offset,
+                limit: params.limit
+            }
+        })
     }
 }
 
diff --git a/src/assets/img/empty_robot.png b/src/assets/img/empty_robot.png
new file mode 100644
index 0000000000000000000000000000000000000000..6571382f1d88d7d3dab6af7597d6107888349c67
GIT binary patch
literal 11235
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
F{2y1-C?o&?

literal 0
HcmV?d00001

diff --git a/src/components/RobotStatusList.vue b/src/components/RobotStatusList.vue
index c8a4628..06de22b 100644
--- a/src/components/RobotStatusList.vue
+++ b/src/components/RobotStatusList.vue
@@ -7,9 +7,9 @@
             type="text" 
             placeholder="请输入机器人搜索" 
             v-model="searchText" 
-            @input="handleSearchInput"
+            @keyup.enter="handleSearchInput"
           >
-          <img src="../assets/img/fdj.png" alt="搜索" class="search-icon" />
+          <img src="../assets/img/fdj.png" alt="搜索" class="search-icon" @click="handleSearchInput"/>
         </div>
         <CustomSelect
           v-model="selectedFilter"
@@ -32,9 +32,11 @@
         <button class="retry-button" @click="fetchRobotList">重试</button>
       </div>
       
-      <div v-else-if="groupedRobots.length === 0" class="empty-state">
-        <div class="empty-icon">🔍</div>
-        <div class="empty-text">没有找到机器人</div>
+      <div v-else-if="groupedRobots.length === 0" class="empty-state-container">
+        <EmptyState 
+          subtitle="暂无机器人信息" 
+          :iconSrc="emptyRobot"
+        />
       </div>
       
       <template v-else>
@@ -68,10 +70,23 @@ import { ref, onMounted, onUnmounted, computed, watch } from 'vue'
 import { useRouter } from 'vue-router'
 import BatteryIndicator from './common/BatteryIndicator.vue'
 import CustomSelect from './common/CustomSelect.vue'
+import EmptyState from './common/EmptyState.vue'
 import { homeApi } from '../api/index'
+import emptyRobot from '../assets/img/empty_robot.png'
 
 const router = useRouter()
 
+// 防抖函数
+const debounce = (fn, delay) => {
+  let timer = null
+  return function(...args) {
+    if (timer) clearTimeout(timer)
+    timer = setTimeout(() => {
+      fn.apply(this, args)
+    }, delay)
+  }
+}
+
 // 搜索和筛选
 const searchText = ref('')
 const filterOptions = ['全部', '在线', '离线', '故障']
@@ -83,14 +98,14 @@ const loading = ref(false)
 const error = ref(null)
 
 // 获取机器人列表
-const fetchRobotList = async () => {
+const fetchRobotList = async (searchNumber = null) => {
   loading.value = true
   error.value = null
   
   try {
     const res = await homeApi.getRobotList({
       tenantInfoId: '4fff5d4bcc4b4239941ff077a0da8958', // 租户id
-      number: null, // 机器人名
+      number: searchNumber, // 机器人名，用于搜索
       status: null,  // 是否故障
       onlineStatus: null // 在线状态
     })
@@ -210,8 +225,9 @@ const groupedRobots = computed(() => {
   return grouped.filter(group => group.robots.length > 0)
 })
 
-const handleSearchInput = (e) => {
-  searchText.value = e.target.value
+const handleSearchInput = () => {
+  console.log('点击搜索:', searchText.value)
+  searchRobots()
 }
 
 const handleWheel = (e) => {
@@ -258,7 +274,14 @@ onUnmounted(() => {
 // 监听筛选条件变化，重新获取数据
 watch(selectedFilter, () => {
   console.log('筛选条件变化:', selectedFilter.value)
+  searchRobots() // 重新搜索，应用筛选条件
 })
+
+// 搜索机器人
+const searchRobots = () => {
+  console.log('搜索机器人:', searchText.value)
+  fetchRobotList(searchText.value)
+}
 </script>
 
 <style scoped>
@@ -558,4 +581,20 @@ watch(selectedFilter, () => {
 .robot-status.待机中 {
   color: #00ffff;
 }
+
+.empty-state-container {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  
+}
+:deep(.empty-icon) {
+  width: 213px !important;
+  height: 150px !important;
+}
+:deep(.empty-subtitle) {
+  color: #fff!important;
+  font-size: 16px!important;
+}
 </style> 
\ No newline at end of file
diff --git a/src/components/common/CustomSelect.vue b/src/components/common/CustomSelect.vue
index 7b3a3d2..415284f 100644
--- a/src/components/common/CustomSelect.vue
+++ b/src/components/common/CustomSelect.vue
@@ -53,6 +53,10 @@ const props = defineProps({
   variant: {
     type: String,
     default: 'default' // 可选值：'default', 'search'
+  },
+  font: {
+    type: String,
+    default: 'default' // 可选值：'default', 'small'
   }
 })
 
@@ -108,6 +112,7 @@ const selectOption = (option) => {
 .select-text {
   color: #B9E8FF;
   margin-right: 25px;
+  font-size: v-bind("font === 'small' ? '12px' : '14px'");
 }
 
 .arrow-icon {
@@ -137,7 +142,7 @@ const selectOption = (option) => {
   color: #B9E8FF;
   cursor: pointer;
   white-space: nowrap;
-  font-size: v-bind("size === 'small' ? '12px' : '12px'");
+  font-size: v-bind("font === 'small' ? '12px' : '12px'");
   line-height: v-bind("size === 'small' ? '18px' : '20px'");
 }
 
diff --git a/src/components/common/TitleBlock.vue b/src/components/common/TitleBlock.vue
index fdd7b59..904c8b9 100644
--- a/src/components/common/TitleBlock.vue
+++ b/src/components/common/TitleBlock.vue
@@ -14,7 +14,7 @@ import small_title from '../../assets/img/small_title.png';
 const props = defineProps({
   title: String
 });
-console.log(props.title,"--------------");
+
 const titleBgSrc = computed(() => {
   if (props.title === '最新告警') {
     return title2;
diff --git a/src/components/dialog/AlarmDetailModal.vue b/src/components/dialog/AlarmDetailModal.vue
index 722da8c..faa5983 100644
--- a/src/components/dialog/AlarmDetailModal.vue
+++ b/src/components/dialog/AlarmDetailModal.vue
@@ -164,8 +164,8 @@
       <!-- 底部按钮 -->
       <div class="modal-footer">
         <button class="btn cancel" @click="handleClose">取消</button>
-        <button class="btn confirm" @click="handleConfirm">确认处理</button>
-        <button class="btn report" @click="handleReport">处理并上报</button>
+        <button class="btn confirm" @click="handleConfirm" v-if="alarmData.status !== '已处理'">确认处理</button>
+        <button class="btn report" @click="handleReport" v-if="alarmData.status !== '已处理'">处理并上报</button>
       </div>
     </div>
   </div>
@@ -271,15 +271,17 @@ const updateRemark = (e) => {
 <style scoped>
 .alarm-modal {
   position: fixed;
-  top: 0;
-  left: 0;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
   width: 100vw;
   height: 100vh;
-  /* background: rgba(0, 0, 0, 0.7); */
+  overflow: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1000;
+  background-color: rgba(0, 0, 0, 0.5);
 }
 
 .modal-content {
diff --git a/src/components/dialog/ConfirmDialog.vue b/src/components/dialog/ConfirmDialog.vue
index 4a49a74..5e333fb 100644
--- a/src/components/dialog/ConfirmDialog.vue
+++ b/src/components/dialog/ConfirmDialog.vue
@@ -49,15 +49,17 @@ const handleCancel = () => {
 <style scoped>
 .confirm-dialog-overlay {
   position: fixed;
-  top: 0;
-  left: 0;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
   width: 100vw;
   height: 100vh;
-  background: rgba(0, 0, 0, 0.5);
+  overflow: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1000;
+  background-color: rgba(0, 0, 0, 0.5);
 }
 
 .confirm-dialog {
diff --git a/src/components/dialog/EventDetailModal.vue b/src/components/dialog/EventDetailModal.vue
index ea9b16a..951172e 100644
--- a/src/components/dialog/EventDetailModal.vue
+++ b/src/components/dialog/EventDetailModal.vue
@@ -13,10 +13,10 @@
         <div class="left-content">
           <!-- 主监控 -->
           <div class="main-monitor">
-            <div class="monitor-title">主监控</div>
+            <div class="monitor-title">{{ selectedEvent ? selectedEvent.etypeName : '主监控' }}</div>
             <div class="monitor-view">
-              <template v-if="eventData.mainImage">
-                <img :src="eventData.mainImage" alt="" @error="imgLoadError.main = true" v-show="!imgLoadError.main" />
+              <template v-if="selectedImage">
+                <img :src="selectedImage" alt="" @error="imgLoadError.main = true" v-show="!imgLoadError.main" />
                 <EmptyState 
                   v-if="imgLoadError.main" 
                   subtitle="暂无图片" 
@@ -35,33 +35,18 @@
           
           <!-- 云台监控和热成像 -->
           <div class="sub-monitors">
-            <div class="monitor-item">
-              <div class="monitor-title">云台监控</div>
+            <div class="monitor-item" v-for="index in 2" :key="index-1">
+              <div class="monitor-title">{{ index === 1 ? '云台监控' : '热成像' }}</div>
               <div class="monitor-view">
-                <template v-if="eventData.subImages && eventData.subImages.length > 0">
-                  <img :src="eventData.subImages[0]" alt="" @error="imgLoadError.sub1 = true" v-show="!imgLoadError.sub1" />
-                  <EmptyState 
-                    v-if="imgLoadError.sub1" 
-                    subtitle="暂无图片" 
-                    :iconSrc="empty" 
-                    class="video-empty-state" 
+                <template v-if="selectedEvent && selectedEvent.imageList && selectedEvent.imageList.length >= index">
+                  <img 
+                    :src="selectedEvent.imageList[index-1]" 
+                    alt="" 
+                    @error="imgLoadError['sub'+(index-1)] = true" 
+                    v-show="!imgLoadError['sub'+(index-1)]" 
                   />
-                </template>
-                <EmptyState 
-                  v-else 
-                  subtitle="暂无图片" 
-                  :iconSrc="empty" 
-                  class="video-empty-state" 
-                />
-              </div>
-            </div>
-            <div class="monitor-item">
-              <div class="monitor-title">热成像</div>
-              <div class="monitor-view">
-                <template v-if="eventData.subImages && eventData.subImages.length > 1">
-                  <img :src="eventData.subImages[1]" alt="" @error="imgLoadError.sub2 = true" v-show="!imgLoadError.sub2" />
                   <EmptyState 
-                    v-if="imgLoadError.sub2" 
+                    v-if="imgLoadError['sub'+(index-1)]" 
                     subtitle="暂无图片" 
                     :iconSrc="empty" 
                     class="video-empty-state" 
@@ -89,11 +74,12 @@
                   <th>状态</th>
                 </tr>
                 <tr class="table-content">
-                  <td>{{ eventData.type }}</td>
-                  <td>{{ eventData.time }}</td>
-                  <td>{{ eventData.robotName }}</td>
-                  <td :class="eventData.status">{{ eventData.status }}</td>
+                  <td>{{ selectedEvent ? selectedEvent.etypeName : '' }}</td>
+                  <td>{{ rawCreateTime }}</td>
+                  <td>{{ selectedEvent ? selectedEvent.name : '' }}</td>
+                  <td :class="handleStatus">{{ handleStatus }}</td>
                 </tr>
+               
               </table>
             </div>
           </div>
@@ -102,20 +88,32 @@
           <div class="remark-section">
             <TitleBlock>备注</TitleBlock>
             <div class="remark-content">
-              <div class="remark-box" contenteditable="true" data-placeholder="请输入备注信息..." @input="updateRemark"></div>
+              <div 
+                class="remark-box" 
+                contenteditable="true" 
+                data-placeholder="请输入备注信息..." 
+                @input="updateRemark"
+                v-text="selectedEvent && selectedEvent.remark ? selectedEvent.remark : ''"
+              ></div>
             </div>
           </div>
         </div>
 
         <!-- 右侧监控视图列表 -->
         <div class="right-content">
-          <TitleBlock>监控视图</TitleBlock>
+          <TitleBlock>告警列表</TitleBlock>
           <div class="monitor-list">
-            <div v-for="(monitor, index) in monitorList" :key="index" class="monitor-item">
-              <div class="monitor-title">{{ monitor.title }}</div>
+            <div 
+              v-for="(event, index) in eventList" 
+              :key="event.messageId" 
+              class="monitor-item"
+              :class="{ 'active': selectedEventIndex === index }"
+              @click="selectEvent(event, index)"
+            >
+              <div class="monitor-title">{{ event.etypeName }}</div>
               <div class="monitor-view">
-                <template v-if="monitor.image">
-                  <img :src="monitor.image" alt="" @error="setMonitorError(index)" v-show="!monitorErrors[index]" />
+                <template v-if="event.imagePreview">
+                  <img :src="event.imagePreview" alt="" @error="setMonitorError(index)" v-show="!monitorErrors[index]" />
                   <EmptyState 
                     v-if="monitorErrors[index]" 
                     subtitle="暂无图片" 
@@ -138,15 +136,23 @@
       <!-- 底部按钮 -->
       <div class="modal-footer">
         <button class="btn cancel" @click="handleClose">取消</button>
-        <button class="btn confirm" @click="handleConfirm">确认处理</button>
-        <button class="btn report" @click="handleReport">处理并上报</button>
+        <button 
+          class="btn confirm" 
+          @click="handleConfirm" 
+          v-if="selectedEvent && selectedEvent.handle !== '1'"
+        >确认处理</button>
+        <button 
+          class="btn report" 
+          @click="handleReport" 
+          v-if="selectedEvent && selectedEvent.handle !== '1'"
+        >处理并上报</button>
       </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, watch } from 'vue';
+import { ref, onMounted, watch, computed } from 'vue';
 import TitleBlock from '../common/TitleBlock.vue';
 import EmptyState from '../common/EmptyState.vue';
 import empty from '../../assets/img/empty.png';
@@ -170,14 +176,79 @@ const props = defineProps({
   monitorList: {
     type: Array,
     default: () => []
+  },
+  eventList: {
+    type: Array,
+    default: () => []
   }
 });
 
+// 当前选中的事件和索引
+const selectedEventIndex = ref(0);
+const selectedEvent = ref(null);
+const selectedImage = ref('');
+
+// 格式化时间
+const formatTime = computed(() => {
+  if (!selectedEvent.value || !selectedEvent.value.createTime) {
+    return '';
+  }
+  // 如果已经是格式化的时间，直接返回
+  if (typeof selectedEvent.value.createTime === 'string' && selectedEvent.value.createTime.includes('-')) {
+    return selectedEvent.value.createTime;
+  }
+  // 有T换成" "
+  if (selectedEvent.value.createTime.includes('T')) {
+    selectedEvent.value.createTime = selectedEvent.value.createTime.replace('T', ' ');
+  }
+  // 否则尝试格式化
+  try {
+    const date = new Date(Number(selectedEvent.value.createTime));
+    return date.toLocaleString();
+  } catch (e) {
+    return selectedEvent.value.createTime || '';
+  }
+});
+
+// 新增：原始createTime显示（去掉T）
+const rawCreateTime = computed(() => {
+  if (!selectedEvent.value || !selectedEvent.value.createTime) return '-';
+  return selectedEvent.value.createTime.replace('T', ' ');
+});
+
+// 处理状态计算属性
+const handleStatus = computed(() => {
+  if (!selectedEvent.value) {
+    return '未处理';
+  }
+  return selectedEvent.value.handle === '1' ? '已处理' : '未处理';
+});
+
+// 选择事件
+const selectEvent = (event, index) => {
+  selectedEventIndex.value = index;
+  selectedEvent.value = event;
+  selectedImage.value = event.imagePreview || (event.imageList && event.imageList.length > 0 ? event.imageList[0] : '');
+  
+  // 重置图片加载错误状态
+  resetImgLoadError();
+};
+
+// 初始化选择第一个事件
+watch(() => props.eventList, (newList) => {
+  if (newList && newList.length > 0) {
+    selectEvent(newList[0], 0);
+  } else {
+    selectedEvent.value = null;
+    selectedImage.value = '';
+  }
+}, { immediate: true });
+
 // 追踪图片加载错误状态
 const imgLoadError = ref({
   main: false,
-  sub1: false,
-  sub2: false
+  sub0: false,
+  sub1: false
 });
 
 // 监控视图列表的错误状态
@@ -198,8 +269,8 @@ const setMonitorError = (index) => {
 const resetImgLoadError = () => {
   imgLoadError.value = {
     main: false,
-    sub1: false,
-    sub2: false
+    sub0: false,
+    sub1: false
   };
   monitorErrors.value = [];
 };
@@ -236,14 +307,14 @@ const handleClose = () => {
 
 const handleConfirm = () => {
   emit('confirm', {
-    ...props.eventData,
+    ...selectedEvent.value,
     remark: remarkText.value
   });
 };
 
 const handleReport = () => {
   emit('report', {
-    ...props.eventData,
+    ...selectedEvent.value,
     remark: remarkText.value
   });
 };
@@ -252,20 +323,22 @@ const handleReport = () => {
 <style scoped>
 .event-detail-modal {
   position: fixed;
-  top: 0;
-  left: 0;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
   width: 100vw;
   height: 100vh;
- 
+  overflow: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1000;
+  background-color: rgba(0, 0, 0, 0.5);
 }
 
 .modal-content {
   width: 890px;
-  height: 900px;
+  height: 800px;
   background: url("../../assets/img/alert2.png") no-repeat;
   background-size: 100% 100%;
   border-radius: 4px;
@@ -287,6 +360,7 @@ const handleReport = () => {
   font-size: 28px;
   letter-spacing: 4px;
   padding-left: 20px;
+  line-height: 20px;
 }
 
 .close-icon {
@@ -327,8 +401,8 @@ const handleReport = () => {
 }
 
 .main-monitor {
-  min-height: 300px;
-  height: 300px;
+  min-height: 215px;
+  height: 215px;
 }
 
 .monitor-title {
@@ -337,7 +411,7 @@ const handleReport = () => {
   left: 0;
   width: 100%;
   padding: 5px 10px;
-  /* background: rgba(0, 21, 31, 0.2); */
+  background: rgba(0, 21, 31, 0.5);
   color: #B9E8FF;
   font-size: 12px;
   z-index: 1;
@@ -410,7 +484,7 @@ const handleReport = () => {
 .remark-section{
   border:1px solid rgba(0,206,234,0.7);
   border-radius: 4px;
-  height: 135px;
+  height: 116px;
 }
 .remark-content {
   padding:10px;
@@ -434,7 +508,7 @@ const handleReport = () => {
 }
 
 .monitor-list {
-padding:10px;
+  padding:10px;
   flex: 1;
   overflow-y: auto;
 }
@@ -455,6 +529,16 @@ padding:10px;
 .monitor-list .monitor-item {
   margin-bottom: 10px;
   height: 150px;
+  cursor: pointer;
+  transition: all 0.3s;
+}
+
+.monitor-list .monitor-item:hover {
+  transform: scale(1.02);
+}
+
+.monitor-list .monitor-item.active {
+  border: 2px solid #00FFFF;
 }
 
 .modal-footer {
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 37acc9f..acd066d 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -57,7 +57,7 @@
               </div>
               <CustomSelect
                 v-model="selectedViews[camera.title]"
-                :options="viewOptions"
+                :options="getViewOptionsForCamera(camera)"
                 size="small"
                 variant="search"
                 font="small"
@@ -108,6 +108,10 @@ import Icon3 from '../assets/img/icon3.png'
 import Icon4 from '../assets/img/icon4.png'
 import jkA from '../assets/img/jkA.png'
 import jkRobot from '../assets/img/jkRobot.png'
+import VideoPlayer from '../components/common/VideoPlayer.vue'
+import EmptyState from '../components/common/EmptyState.vue'
+import CustomWebRTCPlayer from '../components/common/CustomWebRTCPlayer.vue'
+import empty from '../assets/img/empty.png'
 
 // 统计数据
 const statistics = ref([
@@ -180,14 +184,20 @@ const cameras = ref([
 
 // 选中的视角
 const selectedViews = ref({
-  'A区厂区监控': '视角1',
-  'B区厂区监控': '视角1',
-  '追随机器人监控': '视角1',
-  '室外机器人监控': '视角1'
+  'A区厂区监控': '',
+  'B区厂区监控': '',
+  '追随机器人监控': '',
+  '室外机器人监控': ''
 });
 
-// 视角选项
-const viewOptions = ['视角1', '视角2'];
+// 获取特定摄像头的视角选项
+const getViewOptionsForCamera = (camera) => {
+  const cameraData = monitorStreams.value[camera.title];
+  if (!cameraData) return [];
+  
+  // 返回该摄像头所有可用的视角名称，无论是否有URL
+  return Object.keys(cameraData);
+};
 
 // 存储所有视频流数据
 const monitorStreams = ref({});
@@ -200,6 +210,15 @@ const fetchMonitorStreams = async () => {
     if (res.code === 200) {
       monitorStreams.value = res.data || {};
       console.log('获取监控视频流成功:', JSON.stringify(monitorStreams.value));
+      
+      // 初始化每个摄像头的默认视角
+      cameras.value.forEach(camera => {
+        const viewOptions = getViewOptionsForCamera(camera);
+        if (viewOptions.length > 0) {
+          // 设置为第一个可用视角
+          selectedViews.value[camera.title] = viewOptions[0];
+        }
+      });
     } else {
       console.error('获取监控视频流失败:', res);
     }
@@ -211,7 +230,7 @@ const fetchMonitorStreams = async () => {
 // 判断流类型是否为WebRTC
 const isWebRTCStream = (url) => {
   if (!url) return false;
-  return url.startsWith('webrtc://') || url.includes('31011500991180041301');
+  return url.startsWith('webrtc://') || url.includes('31011500991180041301') || url.includes('34020000001320000');
 };
 
 // 为摄像头获取视角列表
@@ -219,12 +238,13 @@ const getViewsForCamera = (camera) => {
   const cameraData = monitorStreams.value[camera.title];
   if (!cameraData) return [];
   
-  return viewOptions.map(viewName => {
+  // 获取所有视角并转换为视图对象数组
+  return Object.entries(cameraData).map(([viewName, streamUrl]) => {
     return {
       name: viewName,
-      streamUrl: cameraData[viewName] || ''
+      streamUrl: streamUrl || '' // 保留空字符串URL，不替换为"empty"标识符
     };
-  }).filter(view => view.streamUrl); // 过滤掉没有流URL的视角
+  }); // 不过滤掉没有流URL的视角，保留所有视角
 };
 
 // 判断摄像头是否使用WebRTC
@@ -232,8 +252,8 @@ const isWebRTCCamera = (camera) => {
   const views = getViewsForCamera(camera);
   if (views.length === 0) return false;
   
-  // 检查第一个视角是否为WebRTC流
-  return isWebRTCStream(views[0].streamUrl);
+  // 检查任意视角是否为WebRTC流
+  return views.some(view => isWebRTCStream(view.streamUrl));
 };
 
 const showRobotListModal = ref(false);
diff --git a/src/views/RobotDetail.vue b/src/views/RobotDetail.vue
index 378e865..7597fec 100644
--- a/src/views/RobotDetail.vue
+++ b/src/views/RobotDetail.vue
@@ -69,7 +69,7 @@
           v-model="alarmTab"
           :pending-count="pendingCount"
           :done-count="doneCount"
-          :unread-count="unreadCount"
+          :unread-count="allCount"
           @view-all="handleViewAll"
           @process-all="handleProcessAll"
         />
@@ -215,6 +215,7 @@
       v-model:visible="showViewAllModal"
       :event-data="currentEvent"
       :monitor-list="monitorList"
+      :event-list="eventListData"
       @confirm="handleConfirm"
       @report="handleReport"
     />
@@ -537,6 +538,7 @@ const unreadCountComputed = computed(
 const pendingCount = ref(0);
 const doneCount = ref(0);
 const unreadCount = ref(0);
+const allCount = ref(0); // 添加allCount变量，用于存储全部告警数量
 const alertCount = ref(0);
 const processedCount = ref(0);
 // 当前页面参数
@@ -553,8 +555,51 @@ const setAlarmTab = async (tab) => {
 };
 
 // 查看全部按钮
-const handleViewAll = () => {
-  showViewAllModal.value = true;
+const handleViewAll = async () => {
+  try {
+    isLoading.value = true;
+    
+    // 使用新API获取告警事件列表，每页10条
+    const res = await robotApi.getAlarmDetailList({
+      number: robotId.value,
+      offset: 0,
+      limit: 10
+    });
+    
+    if (res.code === 200 && res.data && res.data.length > 0) {
+      console.log('获取告警事件列表成功:', res.data);
+      
+      // 将API返回的数据传递给EventDetailModal组件
+      showViewAllModal.value = true;
+      
+      // 更新告警事件列表数据
+      currentEvent.value = {
+        mainImage: res.data[0].imagePreview || '',
+        subImages: res.data[0].imageList || [],
+        type: res.data[0].etypeName || '',
+        time: res.data[0].createTime || '',
+        robotName: res.data[0].name || robotId.value,
+        status: res.data[0].handle === '1' ? '已处理' : '未处理'
+      };
+      
+      // 更新monitorList，右侧显示所有告警事件
+      monitorList.value = res.data.map(item => ({
+        title: item.etypeName || '未知告警',
+        image: item.imagePreview || ''
+      }));
+      
+      // 将完整数据传递给弹窗组件
+      eventListData.value = res.data;
+    } else {
+      console.error('获取告警事件列表失败或列表为空');
+      window.$message && window.$message.error('获取告警事件列表失败或列表为空');
+    }
+  } catch (error) {
+    console.error('获取告警事件列表异常:', error);
+    window.$message && window.$message.error('获取告警事件列表失败');
+  } finally {
+    isLoading.value = false;
+  }
 };
 
 // 一键处理按钮
@@ -672,6 +717,7 @@ const getAlarmEventCount = async () => {
       console.log('获取告警数量成功，原始数据:', res.data);
       alertCount.value = res.data.alert_count || 0;
       processedCount.value = res.data.processed_count || 0;
+      allCount.value = res.data.all_count || 0; // 从接口返回的all_count中获取全部告警数量
       
       // 直接更新显示用的计数
       pendingCount.value = alertCount.value;
@@ -680,6 +726,7 @@ const getAlarmEventCount = async () => {
       console.log('告警数量更新:', {
         未处理: alertCount.value,
         已处理: processedCount.value,
+        全部: allCount.value, // 添加日志输出
         当前标签: alarmTab.value,
         pendingCount: pendingCount.value,
         doneCount: doneCount.value
@@ -1350,14 +1397,46 @@ const monitorList = ref([
   { title: '监控视图6', image: '../assets/img/camera-thumb3.jpg' }
 ]);
 
-const handleConfirm = () => {
-  console.log('确认处理');
-  showViewAllModal.value = false;
+const handleConfirm = async (data) => {
+  console.log('确认处理告警事件:', data);
+  
+  // 如果有messageId，处理单个告警事件
+  if (data.messageId) {
+    try {
+      const res = await robotApi.handleSingleAlarmEvent({
+        messageId: data.messageId,
+        remark: data.remark || '',
+        number: robotId.value
+      });
+
+      if (res.code === 200) {
+        console.log('处理单个告警成功');
+        
+        // 更新告警列表
+        await getAlarmEventList();
+        
+        // 更新告警数量
+        await getAlarmEventCount();
+        
+        // 关闭弹窗
+        showViewAllModal.value = false;
+      } else {
+        console.error('处理单个告警失败:', res);
+      }
+    } catch (error) {
+      console.error('处理单个告警异常:', error);
+    }
+  } else {
+    console.log('缺少messageId，无法处理告警');
+    showViewAllModal.value = false;
+  }
 };
 
-const handleReport = () => {
-  console.log('处理并上报');
-  showViewAllModal.value = false;
+const handleReport = async (data) => {
+  console.log('处理并上报告警事件:', data);
+  
+  // 处理逻辑与handleConfirm相同，可能后续会有不同
+  await handleConfirm(data);
 };
 
 // 登录接口调用
@@ -1802,17 +1881,34 @@ watch(alarmTab, async (newValue) => {
 // 添加处理单个告警事件的函数
 const handleAlarmEvent = async (alarm) => {
   try {
-    // 如果是仪表类型的告警或日常巡检，直接打开详情弹窗
+    // 如果是仪表类型的告警或日常巡检，直接处理，不弹窗
     if (alarm.group === "meter" || alarm.content === "日常巡检") {
-      await showMeterDetail(alarm);
+      // 检查 messageId 是否存在
+      if (!alarm.messageId) {
+        window.$message && window.$message.error('缺少 messageId，无法处理该告警');
+        return;
+      }
+      // 可选：添加 loading 状态
+      isLoading.value = true;
+      try {
+        await handleSingleAlarm({ messageId: alarm.messageId });
+      } catch (err) {
+        window.$message && window.$message.error('处理仪表识别告警失败');
+      } finally {
+        isLoading.value = false;
+      }
     } else {
-      // 其他类型的告警也打开详情弹窗
+      // 其他类型的告警弹窗详情
       await showAlarmDetail(alarm);
     }
   } catch (error) {
     console.error('处理告警事件失败:', error);
   }
 };
+
+// 在RobotDetail.vue中添加eventListData变量，用于存储完整的告警事件列表数据
+// 在currentEvent和monitorList之后添加
+const eventListData = ref([]);
 </script>
 
 <style scoped>