From 8214300cb1f7dd1282878fdfcdee03911b0d14ff Mon Sep 17 00:00:00 2001
From: zhangxiaolong <zhangxiaolong@geedgenetworks.com>
Date: Wed, 13 Apr 2022 17:47:09 +0800
Subject: [PATCH] =?UTF-8?q?fix=20:=20=E4=BF=AE=E5=A4=8D=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=A4=96=E7=82=B9=E5=87=BB=E9=97=AE=E9=A2=98=20=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../css/components/common/bottomBox/panelTabNew.scss       | 7 ++++++-
 nezha-fronted/src/components/common/timePicker.vue         | 7 +++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/nezha-fronted/src/assets/css/components/common/bottomBox/panelTabNew.scss b/nezha-fronted/src/assets/css/components/common/bottomBox/panelTabNew.scss
index bd5fc8856..b13a423ec 100644
--- a/nezha-fronted/src/assets/css/components/common/bottomBox/panelTabNew.scss
+++ b/nezha-fronted/src/assets/css/components/common/bottomBox/panelTabNew.scss
@@ -92,7 +92,7 @@
     color: #60BEFF;
     font-size: 13px
   }
-
+  
   .panel-dropdown-btn:hover {
     color: #409EFF;
   }
@@ -151,6 +151,11 @@
       background: $--background-color-empty;
     }
   }
+  &.el-button--mini{
+    color: $--color-text-label;
+    background-color: $--color-primary;
+    border-color: $--color-primary;
+  }
 
   .nz-dashboard-dropdown {
     height: 300px;
diff --git a/nezha-fronted/src/components/common/timePicker.vue b/nezha-fronted/src/components/common/timePicker.vue
index 8d39d467b..b43d5a7c5 100644
--- a/nezha-fronted/src/components/common/timePicker.vue
+++ b/nezha-fronted/src/components/common/timePicker.vue
@@ -3,6 +3,7 @@
     id="panel-calender"
     :class="{ 'calendar--small': size === 'small' }"
     class="calendar"
+    v-clickoutside="changeDropdownFlag"
   >
 
     <div @click="showDropdown" class="date-range-text">
@@ -63,6 +64,7 @@
                 @click="timeRange(searchTime)"
                 type="primary"
                 size="mini"
+                class="time-range-button el-button--primary"
                 >Apply time range</el-button
               >
             </div>
@@ -248,6 +250,11 @@ export default {
     console.log(this.sign)
   },
   methods: {
+    changeDropdownFlag(){
+      if (this.dropdownFlag) {
+        this.dropdownFlag = false
+      }
+    },
     getItem () {
       this.rangeHistory = localStorage.getItem('date-range-history' + this.sign)
         ? JSON.parse(localStorage.getItem('date-range-history' + this.sign))