From 1559524338032fa33deb9902843fe80c3955241d Mon Sep 17 00:00:00 2001
From: yueliuli <1628111725@qq.com>
Date: Thu, 7 May 2026 11:35:11 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=EF=BC=9A=E5=AF=B9=E8=AF=9D?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E6=AF=8F=E4=B8=AA=E5=AF=B9=E8=AF=9D=E5=90=8E?=
 =?UTF-8?q?=E9=9D=A2=E6=B7=BB=E5=8A=A0=E4=B8=A4=E4=B8=AA=E6=8C=89=E9=92=AE?=
 =?UTF-8?q?=EF=BC=8C**=E8=B7=B3=E8=BD=AC**=EF=BC=8C=E4=BB=A5=E5=8F=8A**?=
 =?UTF-8?q?=E8=B7=B3=E8=BD=AC=E5=B9=B6=E6=92=AD=E6=94=BE**?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../hazard_inspect/SubtitleList.vue           | 77 +++++++++++++++----
 src/pages/nav/HazardCheckResult/index.vue     | 20 ++++-
 2 files changed, 80 insertions(+), 17 deletions(-)

diff --git a/src/components/hazard_inspect/SubtitleList.vue b/src/components/hazard_inspect/SubtitleList.vue
index 8a3fa8a..118871c 100644
--- a/src/components/hazard_inspect/SubtitleList.vue
+++ b/src/components/hazard_inspect/SubtitleList.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { CaretRight, Location } from '@element-plus/icons-vue'
 /**
  * 项目列表展示组件
  * 接收两个参数：title（字符串）和data（字符串数组）
@@ -14,13 +15,16 @@ const props = defineProps({
   },
 })
 
-// 定义输出事件
-const emit = defineEmits(['click'])
+const emit = defineEmits(['click', 'play'])
 
-// 点击项，向外抛出数据
 function handleItemClick(item: any[], index: number) {
   emit('click', item, index)
 }
+
+function handlePlayClick(e: Event, item: any[], index: number) {
+  e.stopPropagation()
+  emit('play', item, index)
+}
 </script>
 
 <template>
@@ -36,10 +40,8 @@ function handleItemClick(item: any[], index: number) {
     <!-- 滚动列表区域 -->
     <el-row style="flex: 1; overflow-y: auto;">
       <el-col>
-        <el-row v-for="(item, index) in props.data" :key="index">
-          <!-- 无物体类型标签 隐患等级体颜色显示在编号标签上 -->
-          <!-- 0为隐患等级 1为隐患描述 -->
-          <el-button class="message-btn" text @click="handleItemClick(item as any[], index)">
+        <el-row v-for="(item, index) in props.data" :key="index" class="message-item">
+          <div class="message-content" @click="handleItemClick(item as any[], index)">
             <div class="flex flex-col items-start">
               <div class="flex flex-row gap-2">
                 <el-text class="item-text" type="info" size="small">
@@ -53,7 +55,29 @@ function handleItemClick(item: any[], index: number) {
                 {{ (item as any[])[3] }}
               </el-text>
             </div>
-          </el-button>
+          </div>
+          <div class="hover-actions">
+            <el-tooltip content="定位" placement="top" effect="light">
+              <el-button
+                type="default"
+                size="small"
+                circle
+                @click="handleItemClick(item as any[], index)"
+              >
+                <el-icon><Location /></el-icon>
+              </el-button>
+            </el-tooltip>
+            <el-tooltip content="播放" placement="top" effect="light">
+              <el-button
+                type="default"
+                size="small"
+                circle
+                @click="handlePlayClick($event, item as any[], index)"
+              >
+                <el-icon><CaretRight /></el-icon>
+              </el-button>
+            </el-tooltip>
+          </div>
         </el-row>
       </el-col>
     </el-row>
@@ -66,7 +90,34 @@ function handleItemClick(item: any[], index: number) {
   width: 100%;
 }
 
-/* 纵向布局 */
+.message-item {
+  position: relative;
+  display: flex;
+  align-items: flex-start;
+  padding: 4px 0.75rem;
+}
+
+.message-content {
+  flex: 1;
+  cursor: pointer;
+}
+
+.hover-actions {
+  position: absolute;
+  right: 8px;
+  top: 50%;
+  height: 100%;
+  transform: translateY(-50%);
+  display: none;
+  padding: 4px 8px;
+  /* background: linear-gradient(to right, rgba(144, 147, 153, 0), var(--ep-color-info)); */
+  border-radius: 4px;
+}
+
+.message-item:hover .hover-actions {
+  display: flex;
+}
+
 .message-btn {
   width: 100%;
   padding: 4px 0.75rem;
@@ -90,14 +141,8 @@ function handleItemClick(item: any[], index: number) {
   gap: 4px;
 }
 
-.message-content {
-  display: flex;
-  justify-content: flex-start;
-  align-items: flex-start;
-}
-
 .item-text.ep-text {
   align-self: start;
-  line-height: 1.5; /* 消除行高留白 */
+  line-height: 1.5;
 }
 </style>
diff --git a/src/pages/nav/HazardCheckResult/index.vue b/src/pages/nav/HazardCheckResult/index.vue
index 98f51b4..fa3ef9e 100644
--- a/src/pages/nav/HazardCheckResult/index.vue
+++ b/src/pages/nav/HazardCheckResult/index.vue
@@ -234,6 +234,19 @@ function handleJumpToTimePoint(seconds: number) {
   videoEl.pause()
 }
 
+function handlePlayAndSeek(item: any[]) {
+  const seconds = item[0]
+  if (Number.isNaN(seconds) || seconds < 0)
+    return
+
+  const videoEl = videoRef.value
+  if (!videoEl)
+    return
+
+  videoEl.currentTime = seconds
+  videoEl.play()
+}
+
 function getAudioRecData(res: any) {
   if (!res) {
     console.error('音频识别结果为空')
@@ -445,7 +458,12 @@ onMounted(() => {
           </el-col>
         </el-row>
         <el-row v-if="data.对话列表.length > 0" style="flex: 1; overflow-y: auto; border-top: 1px solid var(--ep-border-color);">
-          <SubtitleList title="对话" :data="data.对话列表" @click="(item: any[]) => handleJumpToTimePoint(Number(item[0]))" />
+          <SubtitleList
+            title="对话"
+            :data="data.对话列表"
+            @click="(item: any[]) => handleJumpToTimePoint(Number(item[0]))"
+            @play="(item: any[]) => handlePlayAndSeek(item)"
+          />
         </el-row>
         <!-- <el-row class="px-1 py-1">
           <el-button>