From 08315bf54b7dc9657b794aee779bc6b4edb084f0 Mon Sep 17 00:00:00 2001
From: yueliuli <1628111725@qq.com>
Date: Fri, 8 May 2026 15:34:22 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=EF=BC=9A=E9=9A=90=E6=82=A3?=
 =?UTF-8?q?=E7=BB=93=E6=9E=9C=E9=A1=B5=E6=B7=BB=E5=8A=A0=E9=AA=A8=E6=9E=B6?=
 =?UTF-8?q?=E5=B1=8F=E4=B8=8E=E7=A9=BA=E6=95=B0=E6=8D=AE=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增：隐患结果页添加骨架屏与空数据提示
- 修改：优化隐患数据与对话列表之间分割线的显示逻辑
---
 src/components.d.ts                       |  2 ++
 src/pages/nav/HazardCheckResult/index.vue | 30 +++++++++++------------
 2 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/components.d.ts b/src/components.d.ts
index d1b43c8..aad0f35 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -25,6 +25,7 @@ declare module 'vue' {
     ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
     ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
     ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
+    ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElFooter: typeof import('element-plus/es')['ElFooter']
     ElForItem: typeof import('element-plus/es')['ElForItem']
     ElForm: typeof import('element-plus/es')['ElForm']
@@ -45,6 +46,7 @@ declare module 'vue' {
     ElSegmented: typeof import('element-plus/es')['ElSegmented']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSelectV2: typeof import('element-plus/es')['ElSelectV2']
+    ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTag: typeof import('element-plus/es')['ElTag']
diff --git a/src/pages/nav/HazardCheckResult/index.vue b/src/pages/nav/HazardCheckResult/index.vue
index 6c3453a..f59a628 100644
--- a/src/pages/nav/HazardCheckResult/index.vue
+++ b/src/pages/nav/HazardCheckResult/index.vue
@@ -73,6 +73,9 @@ interface ResultData {
 
 const router = useRouter()
 
+const hazardLoading = ref(true)
+const dialogLoading = ref(true)
+
 const vidUrl = ref('')
 const resultData = ref<ResultData>({
   class_list: [],
@@ -362,6 +365,7 @@ onMounted(async () => {
       if (data.value.隐患列表.length > 0) {
         handleHazardClick(0)
       }
+      hazardLoading.value = false
     })
 
     runApiAudio('result', 'GET', {
@@ -369,6 +373,7 @@ onMounted(async () => {
       // path: 'VID_20251104_085655_024.AVI',
     }).then((res) => {
       getAudioRecData(res as AudioResult)
+      dialogLoading.value = false
     })
   }
 })
@@ -389,15 +394,13 @@ onMounted(async () => {
     <!-- 内层容器：自动填充剩余高度 -->
     <el-container style="flex: 1; min-height: 0;">
       <el-aside width="200px" style="border-right: 1px solid var(--ep-border-color);">
-        <!-- <el-row class="flex flex-col" style="border-bottom: 1px solid var(--ep-border-color);"> -->
-        <el-scrollbar>
+        <el-skeleton v-if="hazardLoading" :rows="5" animated style="padding: 0.75rem; width: calc(100% - 1.5rem);" />
+        <el-scrollbar v-else-if="data.隐患列表.length > 0">
           <el-row class="flex flex-col">
             <ItemList title="隐患" :data="data.隐患列表" @click="handleHazardClick" />
           </el-row>
         </el-scrollbar>
-        <!-- <el-row style="flex: 1; overflow-y: auto;">
-          <ItemList title="物体列表" :data="data.物体列表" />
-        </el-row> -->
+        <el-empty v-else description="无隐患数据" style="height: 100%; width: 100%;" />
       </el-aside>
       <el-container style="border-right: 1px solid var(--ep-border-color)">
         <el-main style="border-bottom: 1px solid var(--ep-border-color); padding: 0;">
@@ -424,10 +427,10 @@ onMounted(async () => {
         </el-footer>
       </el-container>
       <el-aside style="width: 300px;">
-        <!-- <el-row style="border-bottom: 1px solid var(--ep-border-color);"> -->
-        <el-scrollbar>
-          <el-row class="px-3 py-2">
-            <el-col v-if="selectedHazard >= 0">
+        <el-skeleton v-if="hazardLoading || dialogLoading" :rows="5" animated style="padding: 0.75rem; width: calc(100% - 1.5rem);" />
+        <el-scrollbar v-else-if="selectedHazard >= 0 || data.对话列表.length > 0">
+          <el-row v-if="selectedHazard >= 0" class="px-3 py-2">
+            <el-col>
               <template v-for="group in groupedFields" :key="group[0].group">
                 <el-row :gutter="12">
                   <el-col v-for="field in group" :key="field.key" :span="24 / group.length">
@@ -457,13 +460,9 @@ onMounted(async () => {
                 </el-button>
               </el-row>
             </el-col>
-            <el-col v-else>
-              <el-row class="px-1 py-1">
-                无选中隐患
-              </el-row>
-            </el-col>
           </el-row>
-          <el-row v-if="data.对话列表.length > 0" style="height: calc(100% - 400px); flex: auto; border-top: 1px solid var(--ep-border-color);">
+          <div v-if="selectedHazard >= 0 && data.对话列表.length > 0" style="width: 100%; border-bottom: 1px solid var(--ep-border-color);" />
+          <el-row v-if="data.对话列表.length > 0" style="height: calc(100% - 400px); flex: auto;">
             <SubtitleList
               title="对话"
               :data="data.对话列表"
@@ -479,6 +478,7 @@ onMounted(async () => {
           </el-button>
         </el-row> -->
         </el-scrollbar>
+        <el-empty v-else description="无隐患与对话数据" style="height: 100%; width: 100%;" />
       </el-aside>
     </el-container>
   </el-container>