bug修复

src/views/screen/components/AlertList.vue

@@ -15,7 +15,7 @@
       <div class="list-wrapper" ref="listWrapperRef" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">
         <!-- 表格模式 -->
         <template v-if="tableTitle && tableTitle.length > 0">
-          <div class="table-row" v-for="(item, index) in listData" :key="`table-${index}`"  @mouseenter="handleMouseEnter">
+          <div @click="handleItemClick(item)" class="table-row cursor-pointer" v-for="(item, index) in listData" :key="`table-${index}`"  @mouseenter="handleMouseEnter">
             <div class="table-cell" v-for="(title, cellIndex) in tableTitle" :key="`cell-${index}-${cellIndex}`">
               {{ item[title.key] || '-' }}
             </div>
@@ -24,7 +24,7 @@
         
         <!-- 列表模式 -->
         <template v-else>
-          <div class="list-item" v-for="(item, index) in listData" :key="`list-${index}`"  @mouseenter="handleMouseEnter">
+          <div @click="handleItemClick(item)" class="list-item cursor-pointer" v-for="(item, index) in listData" :key="`list-${index}`"  @mouseenter="handleMouseEnter">
             <span class="alert-text" :class="[{ error: item.alarm_level_code == 'severity' }, { warn: item.alarm_level_code == 'major' }]">
               {{ (index + 1) }} {{ item.description }}
             </span>
@@ -71,9 +71,14 @@ const props = withDefaults(defineProps<Props>(), {
 const listWrapperRef = ref<HTMLElement | null>(null)
 let scrollTimer: NodeJS.Timeout | null = null
 let isScrolling = false
+let scrollDirection: 'down' | 'up' = 'down' // 滚动方向：向下或向上
+
+const handleItemClick = (item: AlertItem) => {
+  window.open(`http://10.0.64.20/configcenter/console/device-manage`, '_blank')
+}
 
 // 自动滚动功能
-const startAutoScroll = () => {
+const startAutoScroll = (resetToTop: boolean = false) => {
   if (!props.autoScroll || !listWrapperRef.value) return
 
   const wrapper = listWrapperRef.value
@@ -83,20 +88,61 @@ const startAutoScroll = () => {
   // 只有当内容高度超过容器高度时才启动滚动
   if (scrollHeight <= clientHeight) return
 
+  // 如果是首次启动或需要重置，从顶部开始向下滚动
+  if (resetToTop) {
+    wrapper.scrollTop = 0
+    scrollDirection = 'down'
+  } else {
+    // 否则根据当前位置判断滚动方向
+    const currentScrollTop = wrapper.scrollTop
+    const maxScrollTop = scrollHeight - clientHeight
+    
+    if (currentScrollTop >= maxScrollTop - 1) {
+      // 在底部，向上滚动
+      scrollDirection = 'up'
+    } else if (currentScrollTop <= 1) {
+      // 在顶部，向下滚动
+      scrollDirection = 'down'
+    }
+    // 在中间位置，保持当前方向（或默认向下）
+  }
+  
   isScrolling = true
-  let currentScrollTop = listWrapperRef.value.scrollTop
 
   const scroll = () => {
     if (!isScrolling || !wrapper) return
 
-    currentScrollTop += props.scrollSpeed
+    const currentScrollTop = wrapper.scrollTop
+    const maxScrollTop = scrollHeight - clientHeight
 
-    // 如果滚动到底部，重置到顶部
-    if (currentScrollTop >= scrollHeight - clientHeight) {
-      currentScrollTop = 0
-      wrapper.scrollTop = 0
+    if (scrollDirection === 'down') {
+      // 向下滚动
+      const nextScrollTop = currentScrollTop + props.scrollSpeed
+      
+      if (nextScrollTop >= maxScrollTop) {
+        // 滚动到底部，切换方向为向上
+        wrapper.scrollTop = maxScrollTop
+        scrollDirection = 'up'
+        // 在底部停留一小段时间后开始向上滚动
+        scrollTimer = setTimeout(scroll, 500)
+        return
+      } else {
+        wrapper.scrollTop = nextScrollTop
+      }
     } else {
-      wrapper.scrollTop = currentScrollTop
+      // 向上滚动
+      const nextScrollTop = currentScrollTop - props.scrollSpeed
+      
+      if (nextScrollTop <= 0) {
+        // 滚动到顶部，切换方向为向下
+        wrapper.scrollTop = 0
+        scrollDirection = 'down'
+        // 在顶部停留一小段时间后开始向下滚动
+        scrollTimer = setTimeout(scroll, 500)
+        return
+      } else {
+        wrapper.scrollTop = nextScrollTop
+      }
     }
 
     scrollTimer = setTimeout(scroll, 50) // 每50ms滚动一次，实现平滑效果
@@ -121,8 +167,9 @@ const handleMouseEnter = () => {
 const handleMouseLeave = () => {
   if (props.autoScroll) {
     // 延迟启动滚动，避免鼠标快速进出
+    // 从当前位置继续，不重置
     setTimeout(() => {
-      startAutoScroll()
+      startAutoScroll(false)
     }, 500)
   }
 }
@@ -133,7 +180,8 @@ watch(() => props.listData, () => {
     if (props.autoScroll) {
       stopAutoScroll()
       setTimeout(() => {
-        startAutoScroll()
+        // 数据更新后从顶部重新开始
+        startAutoScroll(true)
       }, 1000) // 数据更新后1秒开始滚动
     }
   })
@@ -141,9 +189,9 @@ watch(() => props.listData, () => {
 
 onMounted(() => {
   if (props.autoScroll) {
-    // 组件挂载后延迟启动滚动
+    // 组件挂载后延迟启动滚动，从顶部开始
     setTimeout(() => {
-      startAutoScroll()
+      startAutoScroll(true)
     }, 2000)
   }
 })
@@ -154,6 +202,9 @@ onUnmounted(() => {
 </script>
 
 <style scoped lang="scss">
+.cursor-pointer {
+  cursor: pointer;
+}
 .list-content {
   display: flex;
   width: 68%;

src/views/screen/components/HiddenDangerPanel.vue

@@ -193,6 +193,15 @@ watch(() => props.hiddenDangerData?.progress, (newVal) => {
   refreshProcessCharts(newVal)
 }, { deep: true })
 
+// 辅助函数：安全地将值转换为数字，处理 NaN 和字符串 "NaN" 的情况
+const safeNumber = (val: any): number => {
+  if (val === null || val === undefined || val === '' || val === 'NaN') {
+    return 0
+  }
+  const num = Number(val)
+  return isNaN(num) ? 0 : num
+}
+
 // 更新图表数据
 const refreshProcessCharts = (process): void => {
   if (!props.hiddenDangerData?.progress) {
@@ -200,11 +209,12 @@ const refreshProcessCharts = (process): void => {
     return
   }
   const option = { ...progressChartOption.value }
+  // 确保所有 value 都是有效的数字，将字符串 "NaN" 或真正的 NaN 转换为 0
   option.series[0].data = [
-    { value: process.overdue || 0, name: '已逾期', itemStyle: { color: '#ef4444' } },
-    { value: process.processed || 0, name: '已处理', itemStyle: { color: '#10b981' } },
-    // { value: process.pending || 0, name: '待排查', itemStyle: { color: '#eab308' } },
-    { value: process.processing || 0, name: '处理中', itemStyle: { color: '#3b82f6' } }
+    { value: safeNumber(process.overdue), name: '已逾期', itemStyle: { color: '#ef4444' } },
+    { value: safeNumber(process.processed), name: '已处理', itemStyle: { color: '#10b981' } },
+    // { value: safeNumber(process.pending), name: '待排查', itemStyle: { color: '#eab308' } },
+    { value: safeNumber(process.processing), name: '处理中', itemStyle: { color: '#3b82f6' } }
   ]
   progressChartOption.value = option
 }