fix: detection模块中，调整因修改公共class导致的其他界面样式错乱，以及tab图标不居中的问题

src/views/detections/DetectionRow.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="cn-detection--list" :style="{zIndex: !isCollapse ? 1 : 'unset'}">
+  <div class="cn-detection--list" :style="{zIndex: !isCollapse ? 5 : 'unset'}">
     <!-- 左侧下拉按钮 -->
-    <div class="cn-detection__collapse">
+    <div class="cn-detection__collapse" id="detectionTab" :style="{'padding-top': paddingTop}">
       <span @click="switchCollapse" :class="{'reg-down': !isCollapse}">
         <i class="cn-icon cn-icon-arrow-right"></i>
       </span>
@@ -127,7 +127,8 @@ export default {
       entityType,
       detectionPageType,
       isCollapse: true, // 是否是折叠状态
-      eventSeverityColor
+      eventSeverityColor,
+      paddingTop: '21px'
     }
   },
   computed: {
@@ -163,6 +164,15 @@ export default {
       }
     }
   },
+  mounted () {
+    // 不放在computed是因为第一个dom为null，造成较小屏幕下第一个tab的位置不居中
+    const dom = document.getElementById('detectionTab')
+    let top = 21
+    if (dom) {
+      top = dom.clientHeight / 2 - 12
+    }
+    this.paddingTop = top + 'px'
+  },
   methods: {
     unitConvert,
     getMillisecond,