From 5879ca0c8ac249fa3dfa614c9952d2e02fa42b41 Mon Sep 17 00:00:00 2001
From: "@changcode" <changyongqiang@geedgenetworks.com>
Date: Sun, 26 Sep 2021 11:56:36 +0800
Subject: [PATCH] =?UTF-8?q?style:=E4=B8=8B=E6=8B=89=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E5=99=A8=E6=A0=B7=E5=BC=8F=E7=BB=9F=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 nezha-fronted/src/assets/css/common.scss      | 34 +++++++++----------
 .../src/assets/css/common/rightBoxCommon.scss | 10 ++++++
 .../src/components/common/chartUnit.vue       |  2 +-
 .../src/components/common/elementSet.vue      |  2 +-
 .../common/popBox/selectAssetMetaGroup.vue    |  2 +-
 .../components/common/popBox/selectPanel.vue  |  2 +-
 .../common/popBox/topToolMoreOptions.vue      |  2 +-
 .../rightBox/administration/modelBox.vue      |  1 +
 .../common/rightBox/asset/assetBox.vue        |  4 ++-
 .../common/rightBox/assetMetaBox.vue          |  4 +--
 .../common/rightBox/chartTempBox.vue          |  4 +--
 .../src/components/common/rightBox/dcBox.vue  |  2 +-
 .../common/rightBox/editEndpointBoxNew.vue    |  2 +-
 .../components/common/rightBox/moduleBox.vue  |  4 ++-
 .../common/table/alert/alertMessageTable.vue  |  2 +-
 .../common/table/alert/alertRuleTable.vue     |  2 +-
 .../common/table/alert/alertSilenceTable.vue  |  2 +-
 .../common/table/asset/assetMetaTable.vue     |  2 +-
 .../common/table/asset/assetTable.vue         |  2 +-
 .../common/table/settings/agentTable.vue      |  2 +-
 .../common/table/settings/assetTypeTable.vue  |  2 +-
 .../common/table/settings/cabinetTable.vue    |  2 +-
 .../common/table/settings/chartTmplTable.vue  |  2 +-
 .../table/settings/credentialsTable.vue       |  2 +-
 .../common/table/settings/dcTable.vue         |  2 +-
 .../common/table/settings/endpointTable.vue   |  2 +-
 .../common/table/settings/exprTmplTable.vue   |  2 +-
 .../common/table/settings/menuTable.vue       |  2 +-
 .../common/table/settings/mibTable.vue        |  2 +-
 .../common/table/settings/modelTable.vue      |  2 +-
 .../common/table/settings/moduleTable.vue     |  2 +-
 .../common/table/settings/projectTable.vue    |  2 +-
 .../common/table/settings/roleTable.vue       |  2 +-
 .../table/settings/terminalLogTable.vue       |  4 +--
 .../common/table/settings/userTable.vue       |  2 +-
 .../src/components/common/timePicker.vue      |  4 +--
 .../src/components/layout/header.vue          |  6 ++--
 .../page/config/system/linkTable.vue          |  2 +-
 .../page/config/system/notifyMethodTable.vue  |  2 +-
 .../page/dashboard/explore/exploreItem.vue    |  2 +-
 40 files changed, 75 insertions(+), 60 deletions(-)

diff --git a/nezha-fronted/src/assets/css/common.scss b/nezha-fronted/src/assets/css/common.scss
index 66ede2f66..b631510aa 100644
--- a/nezha-fronted/src/assets/css/common.scss
+++ b/nezha-fronted/src/assets/css/common.scss
@@ -24,24 +24,24 @@
   width: 90px;
   right: 0;
   left: unset !important;
-  top: 35px;
-}
-.nz-dropdown::after {
-  content: '';
-  display: block;
-  width:0;
-  height:0;
-  overflow: hidden;
-  font-size: 0;
-  line-height: 0;
-  border: 5px;
-  border-style: dashed dashed solid dashed;
-  border-color: transparent transparent #fff transparent;
-  position: absolute;
-  right: 3px;
-  top: 44px;
-  transform: translate(-50%, -54px);
+  top: 30px;
 }
+//.nz-dropdown::after {
+//  content: '';
+//  display: block;
+//  width:0;
+//  height:0;
+//  overflow: hidden;
+//  font-size: 0;
+//  line-height: 0;
+//  border: 5px;
+//  border-style: dashed dashed solid dashed;
+//  border-color: transparent transparent #fff transparent;
+//  position: absolute;
+//  right: 3px;
+//  top: 44px;
+//  transform: translate(-50%, -54px);
+//}
 .el-checkbox__inner, .el-input__inner {
   border-color: rgba(0,0,0,0.15)
 }
diff --git a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
index ecf801f14..a9297b758 100644
--- a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
+++ b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
@@ -332,6 +332,12 @@
 .mib-browser-right-box-dropdown {
   width: 236px;
 }
+.right-box-select-format-dropdown {
+  width: 604px;
+  .el-picker-panel__content {
+    width: calc(100% - 28px);
+  }
+}
 .right-public-box-dropdown,
 .right-box-public-dropdown,
 .right-public-box-dropdown-width,
@@ -339,6 +345,7 @@
 .right-box-public-alert-dropdown,
 .asset-right-box-dropdown-width,
 .mib-browser-right-box-dropdown,
+.right-box-select-format-dropdown,
 .right-box-select-top {
   margin-top: 0 !important;
   margin-bottom: 0 !important;
@@ -353,3 +360,6 @@
 .right-box-select-top.right-box-dropdown-top {
   margin: 5px 0 !important;
 }
+.popper__arrow {
+  opacity: 0;
+}
diff --git a/nezha-fronted/src/components/common/chartUnit.vue b/nezha-fronted/src/components/common/chartUnit.vue
index c93e53910..c80908cf8 100644
--- a/nezha-fronted/src/components/common/chartUnit.vue
+++ b/nezha-fronted/src/components/common/chartUnit.vue
@@ -12,7 +12,7 @@
                  :show-all-levels="false"
                  class="chart-unit"
                  placeholder=""
-                 popper-class="prevent-clickoutside unit-pop-class"
+                 popper-class="prevent-clickoutside unit-pop-class right-box-select-top right-box-dropdown-top"
                  size="small"
                  style="border-radius: 0 2px 2px 0;"
                  @change="unitSelected"
diff --git a/nezha-fronted/src/components/common/elementSet.vue b/nezha-fronted/src/components/common/elementSet.vue
index c1c2670a8..24ad35122 100644
--- a/nezha-fronted/src/components/common/elementSet.vue
+++ b/nezha-fronted/src/components/common/elementSet.vue
@@ -135,7 +135,7 @@ export default {
   border: 1px solid #EBEEF5;
   box-shadow: $pop-box-shadow;
   position: absolute;
-  top: 55px;
+  top: 60px;
   right: 20px;
   width: 200px;
   color: #606266;
diff --git a/nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue b/nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue
index 3556f5839..caf4c47cf 100644
--- a/nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue
+++ b/nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-popover ref="selectAssetMetaGroupPopBox" v-model="popBox.show" :placement="placement" popper-class="nz-pop nz-pop-select-panel nz-pop-select-panel__dropdown" transition="slide" width="300">
+  <el-popover ref="selectAssetMetaGroupPopBox" v-model="popBox.show" :placement="placement" popper-class="nz-pop nz-pop-select-panel right-box-select-top right-box-dropdown-top nz-pop-select-panel__dropdown" transition="slide" width="300">
     <div>
       <div class="pop-item-wider">
 
diff --git a/nezha-fronted/src/components/common/popBox/selectPanel.vue b/nezha-fronted/src/components/common/popBox/selectPanel.vue
index c54266d94..4c4dc66ed 100644
--- a/nezha-fronted/src/components/common/popBox/selectPanel.vue
+++ b/nezha-fronted/src/components/common/popBox/selectPanel.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-popover :placement="placement" popper-class="nz-pop nz-pop-select-panel nz-pop-select-panel__dropdown" ref="selectPanelPopBox" transition="slide" v-model="popBox.show" width="310" :disabled="disabled">
+  <el-popover :placement="placement" popper-class="nz-pop nz-pop-select-panel right-box-select-top right-box-dropdown-top nz-pop-select-panel__dropdown" ref="selectPanelPopBox" transition="slide" v-model="popBox.show" width="310" :disabled="disabled">
     <div>
       <div class="pop-item-wider">
 
diff --git a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue b/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
index ef4e0323b..7951b4fc9 100644
--- a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
+++ b/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
@@ -3,7 +3,7 @@
     <button id="more" :class="triggerButtonClass" title="more...">
       <i class="nz-icon nz-icon-more2" style="font-size: 12px;"></i>
     </button>
-    <el-dropdown-menu slot="dropdown">
+    <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
       <el-dropdown-item  v-if="showLock">
         <div @click="panelLock=!panelLock" id="panel-lock"><i :class="{'nz-icon nz-icon-lock':panelLock,'nz-icon nz-icon-unlock':!panelLock}"></i>{{panelLock ? $t("overall.locked") : $t("overall.unlocked")}}</div>
       </el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue b/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
index 9b2df82a1..c731d8386 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
@@ -32,6 +32,7 @@
            :language="language"
             title="ChartSearch"
             key-field="id"
+            :width="640"
             v-model="editModel.chartIds"
             show-field="name"
             class="form-control"
diff --git a/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue b/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
index 59afe3bf0..08bb957a1 100644
--- a/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
@@ -108,7 +108,7 @@
                   </el-checkbox-group>
                 </template>
                 <template v-else-if="label.type.toUpperCase() === assetConstants.labelTypeData.SELECT">
-                  <el-select v-model="label.value[0]" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" size="small">
+                  <el-select v-model="label.value[0]" class="right-box__select" popper-class="right-box-select-format-dropdown prevent-clickoutside" size="small">
                     <el-option v-for="item in JSON.parse(label.param).items" :key="item.name" :label="item.name" :value="item.name"></el-option>
                   </el-select>
                 </template>
@@ -135,6 +135,7 @@
                         v-model="label.value[0]"
                         :type="JSON.parse(label.param).subType === assetConstants.labelSubTypeData.date ? 'dateRange' : 'datetimerange'"
                         placeholder=""
+                        popper-class="right-box-select-format-dropdown"
                         size="small"
                         style="width: 100%">
                       </my-date-picker>
@@ -145,6 +146,7 @@
                         v-model="label.value[0]"
                         :type="JSON.parse(label.param).subType"
                         placeholder=""
+                        popper-class="right-box-select-format-dropdown"
                         size="small"
                         style="width: 100%"
                         value-format="yyyy-MM-dd">
diff --git a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
index 4dc018988..79efe76d3 100644
--- a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
@@ -20,7 +20,7 @@
               <el-input placeholder="" maxlength="128" show-word-limit v-model="editAssetMeta.metaKey" size="small" id="editAssetMeta-box-input-key"></el-input>
             </el-form-item>
             <el-form-item :label='$t("config.assetLabel.group")' prop="groupId">
-              <el-select v-model="editAssetMeta.groupId" size="small" class="right-box__select" popper-class="right-box-select-dropdown right-public-box-dropdown prevent-clickoutside" :popper-append-to-body="false">
+              <el-select v-model="editAssetMeta.groupId" size="small" class="right-box__select" popper-class="right-public-box-dropdown prevent-clickoutside" :popper-append-to-body="false">
                 <el-option v-for="(item, index) in groupData" :key="index" :value="item.id" :label="item.name"></el-option>
               </el-select>
             </el-form-item>
@@ -42,7 +42,7 @@
               </el-switch>
             </el-form-item>
             <el-form-item :label='$t("config.assetLabel.type")' prop="type">
-              <el-select v-model="editAssetMeta.type" :popper-append-to-body="false" class="right-box__select" popper-class="right-box-select-dropdown right-public-box-dropdown prevent-clickoutside" size="small" @change="selectType">
+              <el-select v-model="editAssetMeta.type" :popper-append-to-body="false" class="right-box__select" popper-class="right-public-box-dropdown prevent-clickoutside" size="small" @change="selectType">
                 <el-option v-for="(item, index) in typeData" :key="index" :value="item.value" :disabled="item.disabled">
                   <div><i :class="item.icon"></i>&nbsp;&nbsp;<span>{{item.name}}</span></div>
                 </el-option>
diff --git a/nezha-fronted/src/components/common/rightBox/chartTempBox.vue b/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
index 87f0cab67..58598e3af 100644
--- a/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
@@ -16,7 +16,7 @@
                        class="right-box__select"
                        clearable
                        placeholder=""
-                       popper-class="right-box-select-dropdown prevent-clickoutside"
+                       popper-class="right-public-box-dropdown prevent-clickoutside"
                        size="small"
                        value-key="chartType"
                        @change="varTypeChange">
@@ -31,7 +31,7 @@
                        v-model="editChartTemp.pid"
                        class="right-box__select" clearable
                        placeholder=""
-                       popper-class="right-box-select-dropdown prevent-clickoutside"
+                       popper-class="right-public-box-dropdown prevent-clickoutside"
                        size="small"
                        value-key="chartType" >
               <el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in chartTempArr">
diff --git a/nezha-fronted/src/components/common/rightBox/dcBox.vue b/nezha-fronted/src/components/common/rightBox/dcBox.vue
index 8ebb92cc6..fd6ea953b 100644
--- a/nezha-fronted/src/components/common/rightBox/dcBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/dcBox.vue
@@ -21,7 +21,7 @@
               <el-input placeholder="" maxlength="128" show-word-limit v-model="editDc.tel" size="small" id="dc-box-input-tel"></el-input>
             </el-form-item>
             <el-form-item :label='$t("asset.principal")' prop="principal">
-              <el-select value-key="id" class="right-box__select" popper-class="right-box-select-dropdown right-box-dropdown-top  prevent-clickoutside" v-model="editDc.principal" placeholder="" size="small" id="dc-box-input-principal">
+              <el-select value-key="id" class="right-box__select" popper-class="right-public-box-dropdown right-box-dropdown-top prevent-clickoutside" v-model="editDc.principal" placeholder="" size="small" id="dc-box-input-principal">
                 <el-option v-for="item in userData" :key="item.id" :label="item.name" :value="item.id" style="width: 620px">
                   <span class="user-name" :title="item.name">{{item.name}}</span><span class="user-username" :title="item.username">@{{item.username}}</span>
                 </el-option>
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
index d0d5a6761..b8cffd24c 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -495,7 +495,7 @@
                           :rules="[{ required: true, message: $t('validate.required'), trigger: 'blur' }]"
                         >
 <!--                          <el-input v-model="item2.format" placeholder="key" size="mini"></el-input>-->
-                          <el-select v-model="item2.format" :id="'timestamp' + index +'-' + index2" class="right-box__select" placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small">
+                          <el-select v-model="item2.format" :id="'timestamp' + index +'-' + index2" class="right-box__select" placeholder="" popper-class="right-box-select-format-dropdown prevent-clickoutside" size="small">
                             <el-option v-for="item in timestampList" :id="'module-timestamp-'+item" :key="item" :label="item" :value="item"></el-option>
                           </el-select>
                         </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
index 6eab35cfb..28ca953c3 100644
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -56,6 +56,7 @@
               v-model="editModule.endpointNameTmpl"
               :fetch-suggestions="querySearch"
               :placeholder="$t('overall.placeHolder')"
+              popper-class="right-box-select-top right-box-dropdown-top"
               class="inline-input"
               size="small"
             ></el-autocomplete>
@@ -74,6 +75,7 @@
               title="ChartSearch"
               key-field="id"
               show-field="name"
+              :width="626"
               v-model="editModule.chartIds"
               class="form-control"
               :result-format="resultFormat"
@@ -474,7 +476,7 @@
                         :prop="'configs.1.config.'+ index +'.pipeline.' + index2 + '.format'"
                         :rules="[{ required: true, message: $t('validate.required'), trigger: 'blur' }]"
                       >
-                        <el-select v-model="item2.format" :id="'timestamp' + index +'-' + index2" class="right-box__select" placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small">
+                        <el-select v-model="item2.format" :id="'timestamp' + index +'-' + index2" class="right-box__select" placeholder="" popper-class="right-box-select-format-dropdown  prevent-clickoutside" size="small">
                           <el-option v-for="item in timestampList" :id="'module-timestamp-'+item" :key="item" :label="item" :value="item"></el-option>
                         </el-select>
                       </el-form-item>
diff --git a/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue b/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
index c2da839a7..76b81925a 100644
--- a/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
@@ -117,7 +117,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
 <!--            <el-dropdown-item :command="['showText', scope.row]"><i class="nz-icon nz-icon-guzhangshuju"></i><span class="operation-dropdown-text">{{$t('alert.config.trbShot')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-has="'alertMessage_expired'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'alertSilence_add'" :command="['fastSilence', scope.row, 'alertMessage']"><i class="nz-icon nz-icon-fast-silence"></i><span class="operation-dropdown-text">{{$t('overall.silenceAlert')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue b/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
index 37b1fab0b..20363efa1 100644
--- a/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
@@ -116,7 +116,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
             <el-dropdown-item v-if="!scope.row.buildIn" v-has="'alertRule_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue b/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
index 97ffcbe5d..4608142ee 100644
--- a/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
@@ -94,7 +94,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
 <!--            <el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-has="'alertSilence_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'alertSilence_expire'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('buttons.delete')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue b/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue
index cf256e202..7b7800dbd 100644
--- a/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue
+++ b/nezha-fronted/src/components/common/table/asset/assetMetaTable.vue
@@ -73,7 +73,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
 <!--            <el-dropdown-item v-has="'asset_label_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-has="'asset_label_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'asset_label_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/asset/assetTable.vue b/nezha-fronted/src/components/common/table/asset/assetTable.vue
index 1acbe1953..cbea1699a 100644
--- a/nezha-fronted/src/components/common/table/asset/assetTable.vue
+++ b/nezha-fronted/src/components/common/table/asset/assetTable.vue
@@ -120,7 +120,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-if="!assetTab" v-has="'asset_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'asset_connect'" :command="['cli', scope.row]" :disabled="!scope.row.authUsername"><i class="nz-icon nz-icon-cli"></i><span class="operation-dropdown-text">{{$t('dashboard.connect')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'asset_add'" :command="['duplicate', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('dashboard.duplicate')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/settings/agentTable.vue b/nezha-fronted/src/components/common/table/settings/agentTable.vue
index bcb1ac18a..77429d7e9 100644
--- a/nezha-fronted/src/components/common/table/settings/agentTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/agentTable.vue
@@ -62,7 +62,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'agent_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'agent_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue b/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue
index 7858dfec7..5916172e0 100644
--- a/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/assetTypeTable.vue
@@ -76,7 +76,7 @@
           <div class="table-operation-item table-operation-item--more">
            <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'assetType_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'assetType_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/cabinetTable.vue b/nezha-fronted/src/components/common/table/settings/cabinetTable.vue
index 6991d925e..4b2526869 100644
--- a/nezha-fronted/src/components/common/table/settings/cabinetTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/cabinetTable.vue
@@ -43,7 +43,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'dc_add'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item :command="['delete', scope.row]" v-has="'dc_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue b/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
index 7218cbeb8..1fd16a787 100644
--- a/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
@@ -55,7 +55,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'panel_chart_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'panel_chart_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'panel_chart_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/settings/credentialsTable.vue b/nezha-fronted/src/components/common/table/settings/credentialsTable.vue
index f2d650775..a670bb37e 100644
--- a/nezha-fronted/src/components/common/table/settings/credentialsTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/credentialsTable.vue
@@ -77,7 +77,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'credential_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
diff --git a/nezha-fronted/src/components/common/table/settings/dcTable.vue b/nezha-fronted/src/components/common/table/settings/dcTable.vue
index fc083a46f..f1365e801 100644
--- a/nezha-fronted/src/components/common/table/settings/dcTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/dcTable.vue
@@ -92,7 +92,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'dc_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'dc_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/endpointTable.vue b/nezha-fronted/src/components/common/table/settings/endpointTable.vue
index a42ebddd2..b9081f628 100644
--- a/nezha-fronted/src/components/common/table/settings/endpointTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/endpointTable.vue
@@ -174,7 +174,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
 <!--            <el-dropdown-item v-if="!endpointTab" :command="['endpointQuery', scope.row]"><i class="nz-icon nz-icon-search"></i><span class="operation-dropdown-text">{{$t('overall.query')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-if="!endpointTab" v-has="'monitor_endpoint_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'monitor_endpoint_delete'" :command="['delete', scope.row, `sys/endpoint?ids=${scope.row.id}`]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue b/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue
index 5c2e86a85..50801a0a6 100644
--- a/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/exprTmplTable.vue
@@ -49,7 +49,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'expressionTemplate_add'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'expressionTemplate_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/menuTable.vue b/nezha-fronted/src/components/common/table/settings/menuTable.vue
index cdd1d6a3b..81d36dbab 100644
--- a/nezha-fronted/src/components/common/table/settings/menuTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/menuTable.vue
@@ -66,7 +66,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item  v-has="'monitor_module_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
diff --git a/nezha-fronted/src/components/common/table/settings/mibTable.vue b/nezha-fronted/src/components/common/table/settings/mibTable.vue
index ce5450d50..512e993ac 100644
--- a/nezha-fronted/src/components/common/table/settings/mibTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/mibTable.vue
@@ -82,7 +82,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'snmp_mibFile_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'snmp_mibFile_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/modelTable.vue b/nezha-fronted/src/components/common/table/settings/modelTable.vue
index 5a3a8a9c0..2085e3594 100644
--- a/nezha-fronted/src/components/common/table/settings/modelTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/modelTable.vue
@@ -67,7 +67,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
 <!--            <el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>-->
             <el-dropdown-item v-has="'model_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'model_delete'" :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/settings/moduleTable.vue b/nezha-fronted/src/components/common/table/settings/moduleTable.vue
index 2345405d5..6a2e2630b 100644
--- a/nezha-fronted/src/components/common/table/settings/moduleTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/moduleTable.vue
@@ -71,7 +71,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'monitor_module_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'monitor_module_delete'" :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'monitor_module_edit'" :command="['copy', scope.row, 'module']"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/settings/projectTable.vue b/nezha-fronted/src/components/common/table/settings/projectTable.vue
index f8698077a..f57dbf41e 100644
--- a/nezha-fronted/src/components/common/table/settings/projectTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/projectTable.vue
@@ -71,7 +71,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item :command="['edit', scope.row]" v-has="'project_edit'"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" v-has="'project_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'project_edit'" :command="['copy', scope.row, 'project']"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/table/settings/roleTable.vue b/nezha-fronted/src/components/common/table/settings/roleTable.vue
index 3c6b1d4d8..62b349ef6 100644
--- a/nezha-fronted/src/components/common/table/settings/roleTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/roleTable.vue
@@ -57,7 +57,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'role_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'role_delete'" :command="['delete', scope.row]" :disabled="isBuiltIn(scope.row)"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/terminalLogTable.vue b/nezha-fronted/src/components/common/table/settings/terminalLogTable.vue
index 9ed88e0e5..c6254dde3 100644
--- a/nezha-fronted/src/components/common/table/settings/terminalLogTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/terminalLogTable.vue
@@ -85,7 +85,7 @@
             <div class="table-operation-item table-operation-item--more">
               <i class="nz-icon nz-icon-more3"></i>
             </div>
-            <el-dropdown-menu slot="dropdown">
+            <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
               <el-dropdown-item :command="['shutdown', scope.row]"><i class="nz-icon nz-icon-ZD"></i><span class="operation-dropdown-text">Kill</span></el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
@@ -96,7 +96,7 @@
             <div class="table-operation-item table-operation-item--more">
               <i class="nz-icon nz-icon-more3"></i>
             </div>
-            <el-dropdown-menu slot="dropdown">
+            <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
               <el-dropdown-item :command="['recordTab', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('config.terminallog.record.record')}}</span></el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
diff --git a/nezha-fronted/src/components/common/table/settings/userTable.vue b/nezha-fronted/src/components/common/table/settings/userTable.vue
index c0b730780..4a230fc3e 100644
--- a/nezha-fronted/src/components/common/table/settings/userTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/userTable.vue
@@ -80,7 +80,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
             <el-dropdown-item v-has="'user_edit'" :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'user_edit'" :command="['copy', scope.row]"><i class="nz-icon nz-icon-override"></i><span class="operation-dropdown-text">{{$t('overall.duplicate')}}</span></el-dropdown-item>
             <el-dropdown-item v-has="'user_delete'" :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
diff --git a/nezha-fronted/src/components/common/timePicker.vue b/nezha-fronted/src/components/common/timePicker.vue
index 3e436e221..3cf73e260 100644
--- a/nezha-fronted/src/components/common/timePicker.vue
+++ b/nezha-fronted/src/components/common/timePicker.vue
@@ -107,7 +107,7 @@
         :visible-arrow="false"
         :disabled="isPopoverDisabled"
         trigger="hover"
-        popper-class="popper-z-index"
+        popper-class="popper-z-index right-box-select-top right-box-dropdown-top"
         id="panel-calender-popover">
         <template v-if="this.searchTime&&this.searchTime.length>1">
           <el-row  :gutter="10" class="calendar-popover">
@@ -131,7 +131,7 @@
           </span>
         </div>
       </el-popover>
-      <el-dropdown-menu class="nz-dashboard-dropdown popper-z-index" slot="dropdown">
+      <el-dropdown-menu class="nz-dashboard-dropdown popper-z-index" style="margin-top: 5px" slot="dropdown">
         <!-- <el-dropdown-item >{{$t('dashboard.panel.customTimeRange')}}</el-dropdown-item>  -->
         <template v-for="(item, index) in timeData" >
           <el-dropdown-item v-if="item.id !== 12 || showEmpty" :key="index" :class="showTime.id === item.id ? 'nz-dashboard-dropdown-bg' : ''" :command="item">
diff --git a/nezha-fronted/src/components/layout/header.vue b/nezha-fronted/src/components/layout/header.vue
index e3f1961af..a61691abd 100644
--- a/nezha-fronted/src/components/layout/header.vue
+++ b/nezha-fronted/src/components/layout/header.vue
@@ -7,7 +7,7 @@
     <div class="header-menu">
       <el-dropdown>
         <div class="header-menu__item"><i class="nz-icon nz-icon-more-app"></i></div>
-        <el-dropdown-menu slot="dropdown">
+        <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
           <el-dropdown-item v-for="(item, index) in linkData" :key="index" :index="'0-' + index" v-if="linkData.length">
             <span class="link-title">
               <i class="nz-icon nz-icon-link"></i>
@@ -37,7 +37,7 @@
         <div class="header-menu--item">
           <i class="nz-icon nz-icon-language-change"></i>
         </div>
-        <el-dropdown-menu slot="dropdown">
+        <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
           <el-dropdown-item>
             <div id="header-to-english" :style="language === 'en'?'color:#f90':''" @click="changeLocal('en')"><i class="nz-icon nz-icon-lang-en"></i>English</div>
           </el-dropdown-item>
@@ -48,7 +48,7 @@
       </el-dropdown>
       <el-dropdown>
         <div class="personal-avatar"><span>{{name.substr(0, 1)}}</span>&nbsp;<i class="nz-icon nz-icon-arrow-down"></i></div>
-        <el-dropdown-menu  style="width: 142px" slot="dropdown">
+        <el-dropdown-menu  style="width: 142px" class="right-box-select-top right-box-dropdown-top" slot="dropdown">
           <div class="personal-dropdown">
             <div class="personal-dropdown__username">{{name}}</div>
             <div class="personal-dropdown__name">@{{username}}</div>
diff --git a/nezha-fronted/src/components/page/config/system/linkTable.vue b/nezha-fronted/src/components/page/config/system/linkTable.vue
index 12ab715a7..7583e543e 100644
--- a/nezha-fronted/src/components/page/config/system/linkTable.vue
+++ b/nezha-fronted/src/components/page/config/system/linkTable.vue
@@ -70,7 +70,7 @@
               <div class="table-operation-item table-operation-item--more">
                 <i class="nz-icon nz-icon-more3"></i>
               </div>
-              <el-dropdown-menu slot="dropdown">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
                 <el-dropdown-item :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
diff --git a/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue b/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
index 0969adfa3..70bda9642 100644
--- a/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
+++ b/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
@@ -80,7 +80,7 @@
               <div class="table-operation-item table-operation-item--more">
                 <i class="nz-icon nz-icon-more3"></i>
               </div>
-              <el-dropdown-menu slot="dropdown">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-box-dropdown-top">
                 <el-dropdown-item :command="['delete', scope.row]"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
diff --git a/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue b/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue
index 0bfbedfec..c130ea800 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue
@@ -16,7 +16,7 @@
                 <span>{{selectValue}}</span>
                 <span><i class="el-icon-arrow-down el-icon--right"></i></span>
               </span>
-                <el-dropdown-menu style="width: 118px" class="el-dropdown__width" placement="bottom-end" slot="dropdown">
+                <el-dropdown-menu style="width: 118px" class="el-dropdown__width right-box-select-top right-box-dropdown-top" placement="bottom-end" slot="dropdown">
                   <el-dropdown-item
                     @click.native="selectMetricsLogs(item.label,item.icon, item.value)"
                     v-for="item in searchMetrics"