diff --git a/src/assets/css/components/views/detections/detection-list/detection-list.scss b/src/assets/css/components/views/detections/detection-list/detection-list.scss
index 1c17487f..e19a8e86 100644
--- a/src/assets/css/components/views/detections/detection-list/detection-list.scss
+++ b/src/assets/css/components/views/detections/detection-list/detection-list.scss
@@ -40,7 +40,7 @@
       height: 100%;
       overflow: auto;
 
-      .cn-detection__shadow {
+      .cn-detection__shadow, .new-cn-detection__shadow {
         position: fixed;
         height: 100vh;
         width:100vw;
@@ -49,6 +49,10 @@
         z-index: 1;
         background-color: rgba(0, 0, 0, .2);
       }
+
+      .new-cn-detection__shadow {
+        z-index: 4;
+      }
     }
   }
 
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 3f1ad7c3..0913d5c1 100644
--- a/src/assets/css/components/views/detections/detection-list/row.scss
+++ b/src/assets/css/components/views/detections/detection-list/row.scss
@@ -7,7 +7,7 @@
     justify-content: center;
     align-items: flex-start;
     margin-bottom: 1px;
-    padding-top: 33px;
+    padding-top: 18px;
     background-color: #F3F7FA;
 
     span {
diff --git a/src/assets/css/components/views/entityExplorer/entity-explorer.scss b/src/assets/css/components/views/entityExplorer/entity-explorer.scss
index 44f36367..fbdbff72 100644
--- a/src/assets/css/components/views/entityExplorer/entity-explorer.scss
+++ b/src/assets/css/components/views/entityExplorer/entity-explorer.scss
@@ -26,9 +26,9 @@
     justify-content: flex-start;
   }
 
-  .explorer-top-tools {
+  .explorer-top-tools, .explorer-detection-top-tools {
     display: flex;
-    justify-content: space-between;
+    justify-content: flex-end;
     align-items: center;
     padding-bottom: 18px;
 
@@ -46,6 +46,37 @@
       }
     }
   }
+  .explorer-detection-top-tools {
+    display: flex;
+    justify-content: space-between;
+  }
+  .explorer-top-tools-title {
+    font-size: 24px;
+    line-height: 24px;
+    font-weight: 900;
+    color: #353636;
+  }
+  .explorer-top-tools-block {
+    font-family: NotoSansHans-Medium;
+    height: 28px;
+    line-height: 28px;
+    font-size: 14px;
+    color: #353636;
+    font-weight: 500;
+    padding: 0 10px;
+    margin-right: 10px;
+    border: 1px solid #E0E0E0;
+    border-radius: 2px;
+    cursor: pointer;
+  }
+  .detection-icon-setting {
+    margin-right: 10px;
+    font-size: 14px;
+  }
+  .detection-border {
+    border: 1px solid #E0E0E0;
+    border-radius: 4px;
+  }
   .explorer-container {
     display: flex;
     overflow: visible; /*overflow: hidden;*/
diff --git a/src/components/common/TimeRange/DateTimeRange.vue b/src/components/common/TimeRange/DateTimeRange.vue
index b1972f38..10fa78c2 100644
--- a/src/components/common/TimeRange/DateTimeRange.vue
+++ b/src/components/common/TimeRange/DateTimeRange.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-ele-click-outside="changeDropdown" style="position: relative;z-index: 99" class="date-range-box">
+  <div v-ele-click-outside="changeDropdown" style="position: relative;z-index: 2" class="date-range-box">
     <div @click="showDropdown" class="date-range-text">
       <div class="calendar-popover-text"><i class="cn-icon cn-icon-Data"></i></div>
       <div class="calendar-popover-text" style="display: flex" v-if="isCustom">
diff --git a/src/views/detections/DetectionList.vue b/src/views/detections/DetectionList.vue
index bff39085..8d5f9661 100644
--- a/src/views/detections/DetectionList.vue
+++ b/src/views/detections/DetectionList.vue
@@ -4,7 +4,7 @@
     <div class="detection-list__content">
       <div class="detection-list--list">
         <div class="no-data" v-if="noData">No data</div>
-        <div v-if="!isCollapse" @click="collapse" class="cn-detection__shadow"></div>
+        <div v-if="!isCollapse" @click="collapse" class="cn-detection__shadow new-cn-detection__shadow"></div>
         <detection-row
             style="margin-bottom: 10px"
             class="detection-border"
diff --git a/src/views/detections/DetectionRow.vue b/src/views/detections/DetectionRow.vue
index 145e871e..3fb0feb2 100644
--- a/src/views/detections/DetectionRow.vue
+++ b/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,
diff --git a/src/views/detections/Index.vue b/src/views/detections/Index.vue
index e29b573a..b9978797 100644
--- a/src/views/detections/Index.vue
+++ b/src/views/detections/Index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="entity-explorer entity-explorer--show-list">
     <!-- 顶部工具栏，在列表页显示 -->
-    <div class="explorer-top-tools">
+    <div class="explorer-top-tools explorer-detection-top-tools">
       <div class="explorer-top-tools-title">{{$t('overall.detections')}}</div>
       <div style="display: flex">
         <div class="explorer-top-tools-block">
@@ -833,33 +833,3 @@ export default {
   }
 }
 </script>
-
-<style>
-  .explorer-top-tools-title {
-    font-size: 24px;
-    line-height: 24px;
-    font-weight: 900;
-    color: #353636;
-  }
-  .explorer-top-tools-block {
-    font-family: NotoSansHans-Medium;
-    height: 28px;
-    line-height: 28px;
-    font-size: 14px;
-    color: #353636;
-    font-weight: 500;
-    padding: 0 10px;
-    margin-right: 10px;
-    border: 1px solid #E0E0E0;
-    border-radius: 2px;
-    cursor: pointer;
-  }
-  .detection-icon-setting {
-    margin-right: 10px;
-    font-size: 14px;
-  }
-  .detection-border {
-    border: 1px solid #E0E0E0;
-    border-radius: 4px;
-  }
-</style>