From 5a1f177ae17a300150ee32dbd9d3635540371392 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E6=B4=AA=E6=B4=AA?= <2498601771@qq.com>
Date: Tue, 15 Nov 2022 18:33:07 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20Detection=E6=A8=A1=E5=9D=97=E5=8F=B3?=
 =?UTF-8?q?=E4=BE=A7tab=E7=9A=84=E5=9B=BE=E6=A0=87=E8=87=AA=E9=80=82?=
 =?UTF-8?q?=E5=BA=94=E5=B1=85=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/detections/detection-list/row.scss   | 11 ++++++++++-
 src/views/detections/DetectionRow.vue          | 18 +++++-------------
 2 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/assets/css/components/views/detections/detection-list/row.scss b/src/assets/css/components/views/detections/detection-list/row.scss
index d277989f..838bc658 100644
--- a/src/assets/css/components/views/detections/detection-list/row.scss
+++ b/src/assets/css/components/views/detections/detection-list/row.scss
@@ -7,9 +7,18 @@
     justify-content: center;
     align-items: flex-start;
     margin-bottom: 1px;
-    padding-top: 18px;
+    //padding-top: 18px;
     background-color: #EFF2F5;
 
+    .cn-detection__collapse-block {
+      min-height: 66px;
+      height: 100%;
+      max-height: 88px;
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+    }
+
     span {
       transform: rotate(0);
       transition: all linear .2s;
diff --git a/src/views/detections/DetectionRow.vue b/src/views/detections/DetectionRow.vue
index 3fb0feb2..ef3af0eb 100644
--- a/src/views/detections/DetectionRow.vue
+++ b/src/views/detections/DetectionRow.vue
@@ -1,10 +1,12 @@
 <template>
   <div class="cn-detection--list" :style="{zIndex: !isCollapse ? 5 : 'unset'}">
     <!-- 左侧下拉按钮 -->
-    <div class="cn-detection__collapse" id="detectionTab" :style="{'padding-top': paddingTop}">
-      <span @click="switchCollapse" :class="{'reg-down': !isCollapse}">
+    <div class="cn-detection__collapse">
+      <div class="cn-detection__collapse-block" @click="switchCollapse">
+        <span :class="{'reg-down': !isCollapse}">
         <i class="cn-icon cn-icon-arrow-right"></i>
       </span>
+      </div>
     </div>
     <div class="cn-detection__case">
       <div class="cn-detection__icon" :style="`background-color: ${eventSeverityColor[detection.eventSecurity]}`"></div>
@@ -127,8 +129,7 @@ export default {
       entityType,
       detectionPageType,
       isCollapse: true, // 是否是折叠状态
-      eventSeverityColor,
-      paddingTop: '21px'
+      eventSeverityColor
     }
   },
   computed: {
@@ -164,15 +165,6 @@ 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,