diff --git a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
index 068a97457..36a1ee3c2 100644
--- a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
+++ b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
@@ -319,7 +319,7 @@
   margin-top: 0 !important;
   margin-bottom: 0 !important;
 }
-.api-select.right-public-box-select-top.right-public-box-dropdown-top {
+.api-select.right-box-select-top.right-public-box-dropdown-top {
   .el-scrollbar__view.el-select-dropdown__list {
     width: 210px;
     text-overflow: ellipsis;
@@ -327,9 +327,12 @@
     white-space: nowrap;
   }
 }
-.dc-dropdown.right-public-box-dropdown-top,.right-public-box-select-top.right-public-box-dropdown-top {
+.dc-dropdown.right-public-box-dropdown-top,.right-box-select-top.right-public-box-dropdown-top {
   margin: 5px 0 !important;
 }
+.time-picker-popover__select-top {
+  margin-top: 8px !important;
+}
 .agent-select {
   z-index: 2200 !important;
 }
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
index 36a72b50b..eb808f5a0 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
@@ -15,7 +15,7 @@
     >
       <template v-slot:title><span :title="obj.name">{{obj.name}}</span></template>
       <template v-slot:top-tool-right>
-        <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-public-box-select-top right-public-box-dropdown-top">
+        <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-box-select-top">
           <el-option v-for="item in stateOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
         </el-select>
         <pick-time v-model="searchTimeHeader" :default-pick="12" :refresh-data-func="getTableData" :show-empty="true" :use-chart-unit="false" :use-refresh="false"></pick-time>
diff --git a/nezha-fronted/src/components/common/chartUnit.vue b/nezha-fronted/src/components/common/chartUnit.vue
index 00ce0303e..2c5cc2c1f 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 right-public-box-select-top right-public-box-dropdown-top"
+                 popper-class="prevent-clickoutside unit-pop-class right-box-select-top right-public-box-dropdown-top"
                  size="small"
                  style="border-radius: 0 2px 2px 0;"
                  @change="unitSelected"
diff --git a/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue b/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue
index 715ac4486..0d3660064 100644
--- a/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue
+++ b/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue
@@ -22,7 +22,7 @@
                 </div>
                 <i class="nz-icon nz-icon-arrow-down search-value"/>
               </div>
-              <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
                 <div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}"  suffix-icon="el-icon-search"/></div>
                  <el-checkbox-group v-model="selectValue[item.key]">
                     <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" :title="item3.name">
@@ -53,7 +53,7 @@
                 </div>
                 <i class="nz-icon nz-icon-arrow-down search-value"/>
               </div>
-              <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
                 <div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}"  suffix-icon="el-icon-search"/></div>
                  <el-checkbox-group v-model="selectValue[item.key]">
                     <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" >
@@ -85,7 +85,7 @@
                 </div>
                 <i class="nz-icon nz-icon-arrow-down search-value"/>
               </div>
-              <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
                 <div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}"  suffix-icon="el-icon-search"/></div>
                  <el-checkbox-group v-model="selectValue[item.key]">
                     <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" >
diff --git a/nezha-fronted/src/components/common/detailView/nzDetailView.vue b/nezha-fronted/src/components/common/detailView/nzDetailView.vue
index ebf0933b0..11eeb2372 100644
--- a/nezha-fronted/src/components/common/detailView/nzDetailView.vue
+++ b/nezha-fronted/src/components/common/detailView/nzDetailView.vue
@@ -23,7 +23,7 @@
                       type="button">
                 <i class="nz-icon nz-icon-detail-view" />
               </button>
-              <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
                 <el-dropdown-item :command="'list'" :class="detailType === 'list' ? 'active' : ''">{{$t('asset.detail.list')}}</el-dropdown-item>
                 <el-dropdown-item :command="'view'" :class="detailType === 'view' ? 'active' : ''">{{$t('asset.detail.detail')}}</el-dropdown-item>
               </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/multipleTime.vue b/nezha-fronted/src/components/common/multipleTime.vue
index 7d9776bad..0411f3fbf 100644
--- a/nezha-fronted/src/components/common/multipleTime.vue
+++ b/nezha-fronted/src/components/common/multipleTime.vue
@@ -140,7 +140,7 @@
             :visible-arrow="false"
             :disabled="isPopoverDisabled"
             trigger="hover"
-            popper-class="popper-z-index right-public-box-select-top right-public-box-dropdown-top"
+            popper-class="popper-z-index right-box-select-top right-public-box-dropdown-top"
             id="panel-calender-popover">
             <template v-if="this.searchTime&&this.searchTime.length>1">
               <el-row  :gutter="10" class="calendar-popover">
@@ -164,7 +164,7 @@
           </span>
             </div>
           </el-popover>
-          <el-dropdown-menu class="nz-dashboard-dropdown right-public-box-select-top right-public-box-dropdown-top popper-z-index" slot="dropdown">
+          <el-dropdown-menu class="nz-dashboard-dropdown right-box-select-top right-public-box-dropdown-top popper-z-index" 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" :key="index" :class="showTime.id === item.id ? 'nz-dashboard-dropdown-bg' : ''" :command="item">
diff --git a/nezha-fronted/src/components/common/myDatePicker/src/panel/date-range.vue b/nezha-fronted/src/components/common/myDatePicker/src/panel/date-range.vue
index 2e4873afc..a557e15a7 100644
--- a/nezha-fronted/src/components/common/myDatePicker/src/panel/date-range.vue
+++ b/nezha-fronted/src/components/common/myDatePicker/src/panel/date-range.vue
@@ -2,7 +2,7 @@
   <transition name="el-zoom-in-top" @after-leave="$emit('dodestroy')">
     <div
       v-show="visible"
-      class="el-picker-panel el-date-range-picker el-popper"
+      class="el-picker-panel el-date-range-picker el-popper time-picker-popover__select-top"
       :class="[{
         'has-sidebar': $slots.sidebar || shortcuts,
         'has-time': showTime
diff --git a/nezha-fronted/src/components/common/myDatePicker/src/panel/date.vue b/nezha-fronted/src/components/common/myDatePicker/src/panel/date.vue
index 7b6be1868..faf4161db 100644
--- a/nezha-fronted/src/components/common/myDatePicker/src/panel/date.vue
+++ b/nezha-fronted/src/components/common/myDatePicker/src/panel/date.vue
@@ -2,7 +2,7 @@
   <transition name="el-zoom-in-top" @after-enter="handleEnter" @after-leave="handleLeave">
     <div
       v-show="visible"
-      class="el-picker-panel el-date-picker el-popper"
+      class="el-picker-panel el-date-picker el-popper right-box-select-top right-public-box-dropdown-top"
       :class="[{
         'has-sidebar': $slots.sidebar || shortcuts,
         'has-time': showTime
diff --git a/nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue b/nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue
index 3a3d567a8..6c96c8b1f 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 right-public-box-select-top right-public-box-dropdown-top 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-public-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/selectAssetType.vue b/nezha-fronted/src/components/common/popBox/selectAssetType.vue
index eb39cdeb4..f69905f6c 100644
--- a/nezha-fronted/src/components/common/popBox/selectAssetType.vue
+++ b/nezha-fronted/src/components/common/popBox/selectAssetType.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-popover ref="selectAssetTypePopBox" v-model="popBox.show" :placement="placement" :width="width" popper-class="nz-pop nz-pop-select-panel right-box-select-top right-public-box-dropdown-top" transition="slide">
+  <el-popover ref="selectAssetTypePopBox" v-model="popBox.show" :placement="placement" :width="width" popper-class="nz-pop nz-pop-select-panel right-box-select-top" transition="slide">
     <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 601c4e6ba..a84e0e82e 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="chartBox === true ? 'nz-pop nz-pop-select-panel right-box-select-top nz-pop-select-panel__dropdown' : 'nz-pop nz-pop-select-panel right-public-box-select-top right-public-box-dropdown-top nz-pop-select-panel__dropdown'" ref="selectPanelPopBox" transition="slide" v-model="popBox.show" :width="chartBox === true ? 626 : 310" :disabled="disabled">
+  <el-popover :placement="placement" :popper-class="chartBox === true ? 'nz-pop nz-pop-select-panel right-box-select-top nz-pop-select-panel__dropdown' : 'nz-pop nz-pop-select-panel right-box-select-top right-public-box-dropdown-top nz-pop-select-panel__dropdown'" ref="selectPanelPopBox" transition="slide" v-model="popBox.show" :width="chartBox === true ? 626 : 310" :disabled="disabled">
     <div>
       <div class="pop-item-wider">
 
diff --git a/nezha-fronted/src/components/common/popBox/selectWalk.vue b/nezha-fronted/src/components/common/popBox/selectWalk.vue
index ba2708309..7d3e3b2e0 100644
--- a/nezha-fronted/src/components/common/popBox/selectWalk.vue
+++ b/nezha-fronted/src/components/common/popBox/selectWalk.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-popover :disabled="disabled" @show="tempWalk.detailShow = false" v-if="popBox.show" :placement="placement" width="367" ref="selectWalkPopBox" popper-class="right-public-box-select-top right-public-box-dropdown-top nz-pop nz-pop-select-walk" transition="slide">
+  <el-popover :disabled="disabled" @show="tempWalk.detailShow = false" v-if="popBox.show" :placement="placement" width="367" ref="selectWalkPopBox" popper-class="right-box-select-top right-public-box-dropdown-top nz-pop nz-pop-select-walk" transition="slide">
     <div class="pop-item-wider" @click="tempWalk.detailShow = false">
       <div v-if="tempWalk.detailShow" class="el-popover walk-pop" :style="{left: detailPopPosition.left, top: detailPopPosition.top}">
         <p><span class="metirc-tip-list">Name&nbsp;:&nbsp;</span><span>{{tempWalk.name}}</span></p>
diff --git a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue b/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
index efda69a1b..aed09f2dd 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"></i>
     </button>
-    <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top">
+    <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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/project/topologyL5.vue b/nezha-fronted/src/components/common/project/topologyL5.vue
index 43553fcf0..984c42c16 100644
--- a/nezha-fronted/src/components/common/project/topologyL5.vue
+++ b/nezha-fronted/src/components/common/project/topologyL5.vue
@@ -12,7 +12,7 @@
           <el-dropdown trigger="click" size="small" placement="bottom-start" v-has="'topo_icon_list'">
             <span class="el-dropdown-title"><i class="iconfont icon-cube"></i> <i
               class="nz-icon nz-icon-arrow-down"></i></span>
-            <el-dropdown-menu slot="dropdown" @click="dropdownClick" class="right-public-box-select-top right-public-box-dropdown-top">
+            <el-dropdown-menu slot="dropdown" @click="dropdownClick" class="right-box-select-top right-public-box-dropdown-top">
               <div style="height: 450px"  v-loading="imgageLoading">
                 <el-card shadow="hover" style="height:420px;width:284px;overflow-y: auto"
                          class="project-topology-add-node">
@@ -57,7 +57,7 @@
             <div class="full pr10">
               <el-select v-model="lineName" size="small"
                          :popper-append-to-body="false"
-                         popper-class="right-public-box-select-top right-public-box-dropdown-top"
+                         popper-class="right-box-select-top"
                          @change="changeTopologyOpt(lineName,'lineName')">
                <div slot="prefix">
                 <div class="icon-item" style="width: 100%;padding: 0">
@@ -286,7 +286,7 @@
         <el-col :span="4" class="upload-pic-label">{{ $t('overall.folder') }}</el-col>
         <el-col :span="20">
           <el-autocomplete
-            popper-class="right-public-box-select-top right-public-box-dropdown-top"
+            popper-class="right-box-select-top right-public-box-dropdown-top"
             :maxlength="64" show-word-limit
             class="inline-input"
             v-model="uploadPic.unit"
diff --git a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
index 8d25e22ee..77cb956aa 100644
--- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
@@ -15,13 +15,13 @@
         <el-form ref="addEndpoint" :model="endpoint" :rules="rules" label-position = "top">
           <!--project-->
           <el-form-item :label='$t("project.project.projectName")' class="select-warp" prop="projectId">
-            <el-select id="add-endpoint-project" v-model="currentProject" class="right-box__select" placeholder="" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id" @change="((val) => {changeProject(val)})">
+            <el-select id="add-endpoint-project" v-model="currentProject" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" @change="((val) => {changeProject(val)})">
               <el-option v-for="item in projectList" :id="'project-'+item.id" :key="item.id" :label="item.name" :value="item"></el-option>
             </el-select>
           </el-form-item>
           <!--module-->
           <el-form-item :label='$t("project.module.module")' class="select-warp" prop="moduleId">
-            <el-select id="add-endpoint-module" v-model="currentModule" :disabled="!currentProject.id" class="right-box__select" placeholder="" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id" @change="((val) => {changeModule(val)})">
+            <el-select id="add-endpoint-module" v-model="currentModule" :disabled="!currentProject.id" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" @change="((val) => {changeModule(val)})">
               <el-option v-for="item in moduleList" :id="'module-'+item.id" :key="item.id" :label="item.name" :value="item"></el-option>
             </el-select>
           </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue b/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue
index e35b286ac..5a0ba6f08 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue
@@ -33,7 +33,7 @@
           </el-form-item>
           <!--authProtocol-->
           <el-form-item :label='$t("config.assetType.authProtocol")' prop="authProtocol">
-            <el-select class="right-box__select" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside" v-model="editAssetType.authProtocol" placeholder="Please select">
+            <el-select class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" v-model="editAssetType.authProtocol" placeholder="Please select">
               <el-option :key="option.value" v-for="option in assetConstants.assetType.authProtocolOptions" :value="option.value" :label="option.label"></el-option>
             </el-select>
           </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue b/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
index f670a1199..3a808f308 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
@@ -15,7 +15,7 @@
           </el-form-item>
           <!--brand-->
           <el-form-item :label='$t("config.model.brand")' prop="brandId">
-            <el-select value-key="id" allow-create  class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" :filterable="true" v-model="editModel.brandId" placeholder="" size="small" id="module-box-input-project">
+            <el-select value-key="id" allow-create  class="right-box__select" popper-class="right-box-select-top  prevent-clickoutside" :filterable="true" v-model="editModel.brandId" placeholder="" size="small" id="module-box-input-project">
               <el-option :id="'module-project-'+item.id" v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/administration/userBox.vue b/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
index 091e40365..14a4d557d 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
@@ -37,7 +37,7 @@
                        clearable
                        collapse-tags
                        placeholder=""
-                       popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside"
+                       popper-class="right-box-select-top  prevent-clickoutside"
                        size="small">
               <template v-for="item in mfaLevelList">
                 <el-option :key="item.value" :label="item.label" :value="item.value"></el-option>
@@ -60,7 +60,7 @@
                        clearable
                        collapse-tags
                        placeholder=""
-                       popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside"
+                       popper-class="right-box-select-top  prevent-clickoutside"
                        size="small">
               <template v-for="item in languageList">
                 <el-option :key="item.value" :label="item.label" :value="item.value"></el-option>
@@ -76,7 +76,7 @@
                        clearable
                        collapse-tags
                        placeholder=""
-                       popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside"
+                       popper-class="right-box-select-top  prevent-clickoutside"
                        size="small"
                        @change="()=>{this.$forceUpdate()}">
               <template v-for="role in roles">
diff --git a/nezha-fronted/src/components/common/rightBox/agentBox.vue b/nezha-fronted/src/components/common/rightBox/agentBox.vue
index 546300461..8e014c13b 100644
--- a/nezha-fronted/src/components/common/rightBox/agentBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/agentBox.vue
@@ -15,7 +15,7 @@
           <!--DC-->
           <el-form-item :label="$t('config.dc.dc')" prop="dc.name">
             <div class="right-box-form-content">
-              <el-select id="prom-box-input-dc" v-model="editPromServer.dc" placeholder="" class="right-box__select" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+              <el-select id="prom-box-input-dc" v-model="editPromServer.dc" placeholder="" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
                 <el-option v-for="item in dcData" :id="'prom-edit-dc-op-'+item.id" :key="item.id" :label="item.name" :value="item">
                   <span class="config-dropdown-label-txt">{{item.name}}</span>
                 </el-option>
@@ -42,7 +42,7 @@
   <!--            :options="$CONSTANTS.agent.theData"-->
   <!--            :props="{ multiple: false, checkStrictly: false ,emitPath:false}"-->
   <!--            clearable></el-cascader>-->
-            <el-select  v-model="editPromServer.type" :disabled="editPromServer.id != null&& editPromServer.id != ''" placeholder="" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="value">
+            <el-select  v-model="editPromServer.type" :disabled="editPromServer.id != null&& editPromServer.id != ''" placeholder="" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="value">
 <!--              <el-option-group-->
 <!--                v-for="group in agent2.theData"-->
 <!--                :key="group.label"-->
@@ -60,7 +60,7 @@
             </el-input>
           </el-form-item>
           <el-form-item :label="$t('config.agent.protocol')" prop="protocol">
-            <el-select  v-model="editPromServer.protocol" placeholder="" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="value">
+            <el-select  v-model="editPromServer.protocol" placeholder="" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="value">
               <el-option v-for="item in agent2.protocol" :key="item.value" :label="item.label" :value="item.value">
                 <span class="panel-dropdown-label-txt" >{{item.label}}</span>
               </el-option>
diff --git a/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue b/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
index 40a5ae659..029589552 100644
--- a/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
@@ -22,7 +22,7 @@
             <el-select
               v-model="editAlertRule.type"
               class="right-box__select half-form-item"
-              popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside"
+              popper-class="right-box-select-top  prevent-clickoutside"
               size="small"
               :disabled="showTypeSelect"
               @change="selectAlertRuleMetric">
@@ -35,7 +35,7 @@
           </el-form-item>
           <!--severity-->
           <el-form-item :label="$t('alert.severity')" class="severity-box half-form-item" prop="severityId">
-            <el-select id="alert-box-input-severity" v-model="editAlertRule.severityId" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small">
+            <el-select id="alert-box-input-severity" v-model="editAlertRule.severityId" class="right-box__select" placeholder="" popper-class="right-box-select-top  prevent-clickoutside" size="small">
               <el-option v-for="item in severityData" :id="'alert-severity-'+item.value" :key="item.id" :label="item.name" :value="item.id">
                 <div style="display: flex;justify-content: space-between;padding: 5px;">
                   <div><i :style="{color:item.color,'font-size':'12px'}" class="nz-icon nz-icon-circle"></i> {{item.name}}</div>
@@ -103,7 +103,7 @@
           <el-form-item v-if="showSnmpTrap" :label="$t('alert.config.unit')" class="half-form-item" prop="unit" :rules="[{ required: this.editAlertRule.type !== 3, message: this.$t('validate.required'), trigger: 'blur' }]">
             <el-cascader id="alert-box-input-unit" v-model="editAlertRule.unit" :options="unitOptions" :props="{ expandTrigger: 'click',emitPath:false }" :show-all-levels="false" filterable
                          placeholder=""
-                         popper-class="no-style-class dc-dropdown right-public-box-dropdown-top unit-popper-class"
+                         popper-class="no-style-class dc-dropdown  unit-popper-class"
                          size="small"
                          :disabled="!showSnmpTrap"
                          style="width: 100%"
@@ -129,7 +129,7 @@
               v-model="editAlertRule.autoExpired"
               class="right-box__select half-form-item"
               placeholder=""
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top "
               size="small"
             >
               <el-option
@@ -164,7 +164,7 @@
               class="right-box__select half-form-item"
               placeholder=""
               :popper-append-to-body="false"
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top"
               size="small"
             >
               <el-option
@@ -185,7 +185,7 @@
               class="right-box__select half-form-item"
               placeholder=""
               :popper-append-to-body="false"
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top"
               size="small"
             >
               <el-option
@@ -208,7 +208,7 @@
               placeholder=""
               multiple
               @change="$refs.alertRuleForm.validateField('schedDays')"
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top"
               size="small"
             >
               <el-option
@@ -253,7 +253,7 @@
               class="right-box__select half-form-item"
               placeholder=""
               :popper-append-to-body="false"
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top"
               size="small"
               @change="receiverAndNotifyValidate"
             >
@@ -275,7 +275,7 @@
               class="right-box__select half-form-item"
               placeholder=""
               :popper-append-to-body="false"
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top"
               size="small"
               @change="receiverAndNotifyValidate"
             >
@@ -298,7 +298,7 @@
               filterable
               multiple
               placeholder=""
-              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside right-box-select-top"
               size="small"
               value-key="userId"
               @change="receiverShowChange"
@@ -315,7 +315,7 @@
           </el-form-item>
           <!--notify-->
           <el-form-item :label="$t('alert.notify')" :rules="[{ required: editAlertRule.notifyExpired || editAlertRule.notifyActive, message: this.$t('validate.required'), trigger: 'change' }]" class="notify-box" prop="method" >
-            <el-select id="alert-box-input-notify" v-model="editAlertRule.method" class="right-box__select" multiple placeholder="" :popper-append-to-body="false" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small">
+            <el-select id="alert-box-input-notify" v-model="editAlertRule.method" class="right-box__select" multiple placeholder="" :popper-append-to-body="false" popper-class="right-box-select-top prevent-clickoutside" size="small">
               <el-option v-for="item in notifyData" :id="'alert-severity-'+item.value" :key="item.id" :label="item.name" :value="item.id">
               </el-option>
             </el-select>
diff --git a/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue b/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
index 9a7ee73d0..033b8bf36 100644
--- a/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
@@ -11,14 +11,14 @@
         <!-- Edit type -->
         <el-form ref="assetEditForm" :model="editData" :rules="rules" label-position="top" label-width="120px">
           <el-form-item :label="$t('overall.editType')" prop="editType">
-            <el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="value">
+            <el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="value">
               <el-option v-for="type in assetConstants.editTypeOptions" :key="type.value" :label="type.label" :value="type.value"/>
             </el-select>
           </el-form-item>
           <!-- 第一级：Edit type = account -->
           <template v-if="editData.editType === assetConstants.editTypeData.account">
             <el-form-item :label="$t('asset.authProtocol')" prop="authProtocol">
-              <el-select v-model="editData.authProtocol" class="right-box__select" :placeholder="$t('overall.select')" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="value">
+              <el-select v-model="editData.authProtocol" class="right-box__select" :placeholder="$t('overall.select')" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="value">
                 <el-option v-for="type in assetConstants.authProtocolOptions" :key="type.value" :label="type.label" :value="type.value"/>
               </el-select>
             </el-form-item>
@@ -26,7 +26,7 @@
             <template v-if="editData.authProtocol === assetConstants.authProtocolData.ssh">
               <div class="form__sub-title">{{$t('asset.sshAccount')}}</div>
               <el-form-item :label="$t('asset.authType')" prop="authType">
-                <el-select v-model="editData.authType" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="value">
+                <el-select v-model="editData.authType" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="value">
                   <el-option v-for="type in assetConstants.authTypeOptions" :key="type.value" :label="type.label" :value="type.value"/>
                 </el-select>
               </el-form-item>
@@ -103,7 +103,7 @@
                     </el-checkbox-group>
                   </template>
                   <template v-else-if="label.type.toUpperCase() === assetConstants.labelTypeData.SELECT">
-                    <el-select v-model="label.value" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small">
+                    <el-select v-model="label.value" class="right-box__select" popper-class="right-box-select-top 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>
@@ -163,7 +163,7 @@
                 :options="fieldGroupData"
                 :props="labelCascProp"
                 class="hide-input"
-                popper-class="prevent-clickoutside right-public-box-select-top.right-public-box-dropdown-top limit-height"
+                popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top limit-height"
                 size="small"
                 @change="addLabel"
               ></el-cascader>
@@ -173,7 +173,7 @@
           <!-- 第一级：Edit type = state -->
           <template v-if="editData.editType === assetConstants.editTypeData.state">
             <el-form-item :label="$t('asset.state')" prop="stateId">
-              <el-select v-model="editData.stateId" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+              <el-select v-model="editData.stateId" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
                 <el-option v-for="state in stateData" :key="state.id" :label="state.name" :value="state.id"></el-option>
               </el-select>
             </el-form-item>
@@ -182,7 +182,7 @@
           <!-- 第一级：Edit type = snmp credential -->
           <template v-if="editData.editType === assetConstants.editTypeData.snmpCredential">
             <el-form-item :label="$t('asset.snmpCredential')" prop="snmpCredentialId">
-              <el-select v-model="editData.snmpCredentialId" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+              <el-select v-model="editData.snmpCredentialId" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
                 <el-option v-for="snmp in snmpCredentialData" :key="snmp.id" :label="snmp.name" :value="snmp.id"></el-option>
               </el-select>
             </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue b/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
index 3b0d9142c..b1dec4680 100644
--- a/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
@@ -24,7 +24,7 @@
             <el-select
               v-model="editAsset.pid"
               class="right-box__select"
-              popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside"
+              popper-class="right-box-select-top prevent-clickoutside"
               size="small"
               :placeholder="$t('el.select.placeholder')"
               value-key="id">
@@ -32,7 +32,7 @@
             </el-select>
           </el-form-item>
           <el-form-item :label="$t('asset.state')" prop="stateId">
-            <el-select v-model="editAsset.stateId" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+            <el-select v-model="editAsset.stateId" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
               <el-option v-for="state in options.stateOptions" :key="state.id" :label="state.name" :value="state.id">
                 <div style="display: flex;justify-content: space-between;padding: 5px;">
                   <div>{{state.name}}</div>
@@ -56,7 +56,7 @@
               :placeholder="lockModelInputValue"
               :options="options.brandAndModelOptions"
               :props="{ label: 'name', value: 'id' }"
-              popper-class="prevent-clickoutside right-public-box-dropdown-top right-public-box-select-top limit-height"
+              popper-class="prevent-clickoutside right-public-box-dropdown-top right-box-select-top limit-height"
               size="small"
               style="width: 100%;"
             ></el-cascader>
@@ -114,7 +114,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" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small">
+                  <el-select v-model="label.value[0]" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top 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>
@@ -174,7 +174,7 @@
               :options="options.fieldGroupOptions"
               :props="labelCascProp"
               class="hide-input"
-              popper-class="prevent-clickoutside right-public-box-select-top right-public-box-dropdown-top limit-height"
+              popper-class="prevent-clickoutside right-box-select-top right-public-box-dropdown-top limit-height"
               size="small"
               @change="addLabel"
             ></el-cascader>
@@ -183,7 +183,7 @@
           <template v-if="editAsset.type && editAsset.type.authProtocol === assetConstants.authProtocolData.ssh">
             <div class="form__sub-title">SSH</div>
             <el-form-item :label="$t('asset.authType')" prop="authType">
-              <el-select v-model="editAsset.authType" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="value">
+              <el-select v-model="editAsset.authType" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="value">
                 <el-option v-for="type in assetConstants.authTypeOptions" :key="type.value" :label="type.label" :value="type.value"/>
               </el-select>
             </el-form-item>
@@ -226,7 +226,7 @@
           <template v-if="editAsset.type && editAsset.type.snmpEnable === 1">
             <div class="form__sub-title">SNMP</div>
             <el-form-item :label="$t('asset.snmpCredential')" prop="snmpCredentialId">
-              <el-select v-model="editAsset.snmpCredentialId" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+              <el-select v-model="editAsset.snmpCredentialId" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
                 <el-option v-for="snmp in options.snmpCredentialOptions" :key="snmp.id" :label="snmp.name" :value="snmp.id"></el-option>
               </el-select>
             </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
index 28f1a7db1..7517c926b 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" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" :popper-append-to-body="false">
+              <el-select v-model="editAssetMeta.groupId" size="small" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top 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-top right-public-box-dropdown-top prevent-clickoutside" size="small" @change="selectType">
+              <el-select v-model="editAssetMeta.type" :popper-append-to-body="false" class="right-box__select" popper-class="right-box-select-top 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/dcBox.vue b/nezha-fronted/src/components/common/rightBox/dcBox.vue
index 6fc9275f4..8f1fcdcf6 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-public-box-select-top right-public-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-box-select-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 a89595b26..e2abc1e8d 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -28,13 +28,13 @@
         <el-form ref="moduleForm" :model="editEndpoint" :rules="rules" label-position = "top" label-width="120px">
           <!--project-->
           <el-form-item :label='$t("project.project.projectName")' prop="projectId">
-            <el-select id="module-box-input-project" v-model="editEndpoint.projectId" :disabled="disabled" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id" @change="changeProject">
+            <el-select id="module-box-input-project" v-model="editEndpoint.projectId" :disabled="disabled" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" @change="changeProject">
               <el-option v-for="item in projectList" :id="'module-project-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
           <!--module-->
           <el-form-item :label='$t("project.module.module")' prop="moduleId">
-            <el-select @change="renderEndpoint" id="module-box-input-module" v-model="editEndpoint.moduleId" :disabled="!editEndpoint.projectId || disabled " class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+            <el-select @change="renderEndpoint" id="module-box-input-module" v-model="editEndpoint.moduleId" :disabled="!editEndpoint.projectId || disabled " class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
               <el-option v-for="item in moduleList" :id="'module-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
@@ -164,7 +164,7 @@
                 </el-row>
                   <!--credentials-->
                   <el-form-item :label='$t("project.endpoint.credentials")' prop="credentials">
-                    <el-select id="module-box-input-credentials" v-model="editEndpoint.configs[0].config.snmpCredentialsId" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id" disabled>
+                    <el-select id="module-box-input-credentials" v-model="editEndpoint.configs[0].config.snmpCredentialsId" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" disabled>
                       <el-option v-for="item in credentialList" :id="'module-type-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
                     </el-select>
                   </el-form-item>
@@ -248,7 +248,7 @@
                     </div>
                     <div>
                       <el-form-item :prop="'configs.0.config.relabel_config.' + index + '.action'" class="" :label="'Action'" :rules="[{ required: true, message: $t('validate.required'), trigger: 'change' }]">
-                        <el-select v-model="item.action" :id="'action' + index " class="right-box__select " placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" @change="actionChange(index)" :rules="[{ required: true, message: $t('validate.required'), trigger: 'change' }]">
+                        <el-select v-model="item.action" :id="'action' + index " class="right-box__select " placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="actionChange(index)" :rules="[{ required: true, message: $t('validate.required'), trigger: 'change' }]">
                           <el-option v-for="item2 in actionList" :id="'module-action-'+item2.label" :key="item2.label" :label="item2.label" :value="item2.value"></el-option>
                         </el-select>
                       </el-form-item>
@@ -319,7 +319,7 @@
               <el-tab-pane v-if="editEndpoint.configs[0].config.protocol !== 'snmp'" :label="$t('project.endpoint.auth')" name="Auth">
                 <!--authtype-->
                 <el-form-item :label='$t("project.endpoint.type")' prop="authtype">
-                  <el-select id="module-box-input-auth-type" v-model="authType" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id" @change="changeAuthType">
+                  <el-select id="module-box-input-auth-type" v-model="authType" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" @change="changeAuthType">
                     <el-option v-for="item in authTypeList" :id="'module-type-'+item.id" :key="item.value" :label="item.name" :value="item.value"></el-option>
                   </el-select>
                 </el-form-item>
@@ -355,7 +355,7 @@
                   <el-tab-pane :label="$t('project.endpoint.basic')" name="Basic">
                     <!--type-->
                     <el-form-item :label='$t("project.endpoint.type")' class="half-form-item">
-                      <el-select id="module-box-input-type" v-model="item.type" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" @change="logsBasicTypeChange(index)">
+                      <el-select id="module-box-input-type" v-model="item.type" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="logsBasicTypeChange(index)">
                         <el-option v-for="item in logsBasicList" :id="'module-type-'+item.id" :key="item.value" :label="item.name" :value="item.value"></el-option>
                       </el-select>
                     </el-form-item>
@@ -496,7 +496,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-top right-public-box-dropdown-top prevent-clickoutside" size="small">
+                          <el-select v-model="item2.format" :id="'timestamp' + index +'-' + index2" class="right-box__select" placeholder="" popper-class="right-box-select-top 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/exprTmplBox.vue b/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
index f959248e1..1bfebb148 100644
--- a/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
@@ -23,7 +23,7 @@
               :fetch-suggestions="querySearch"
               :placeholder="$t('overall.placeHolder')"
               class="inline-input"
-              popper-class="right-public-box-select-top right-public-box-dropdown-top"
+              popper-class="right-box-select-top right-public-box-dropdown-top"
               size="small"
               style="width: 100%;"
             ></el-autocomplete>
diff --git a/nezha-fronted/src/components/common/rightBox/mibBox.vue b/nezha-fronted/src/components/common/rightBox/mibBox.vue
index 2a045a1bb..6bb3e5f64 100644
--- a/nezha-fronted/src/components/common/rightBox/mibBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/mibBox.vue
@@ -21,7 +21,7 @@
               ref="modelSelector"
               size="small"
               class="right-box__select"
-              popper-class="prevent-clickoutside limit-height right-public-box-select-top right-public-box-dropdown-top"
+              popper-class="prevent-clickoutside limit-height right-box-select-top right-public-box-dropdown-top"
               clearable></el-cascader>
           </el-form-item>
           <el-form-item :label="$t('overall.remark')" prop="remark">
diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
index 2249ae294..dded2ce6b 100644
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -19,7 +19,7 @@
           </el-form-item>
           <!--project-->
           <el-form-item :label='$t("project.project.projectName")' prop="projectId">
-            <el-select id="module-box-input-project" v-model="editModule.projectId" :disabled="!!editModule.id" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top module-project-box-dropdown prevent-clickoutside" size="small" value-key="id">
+            <el-select id="module-box-input-project" v-model="editModule.projectId" :disabled="!!editModule.id" class="right-box__select" placeholder="" popper-class="right-box-select-top module-project-box-dropdown prevent-clickoutside" size="small" value-key="id">
               <el-option v-for="item in projectList" :id="'module-project-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
@@ -56,7 +56,7 @@
               v-model="editModule.endpointNameTmpl"
               :fetch-suggestions="querySearch"
               :placeholder="$t('overall.placeHolder')"
-              popper-class="right-public-box-select-top right-public-box-dropdown-top"
+              popper-class="right-box-select-top right-public-box-dropdown-top"
               class="inline-input"
               size="small"
             ></el-autocomplete>
@@ -93,7 +93,7 @@
             <el-tab-pane :label="$t('project.endpoint.basic')" name="Basic">
               <!--type-->
               <el-form-item :label='$t("project.endpoint.protocol")' class="half-form-item" prop="type">
-                <el-select id="module-box-input-type" v-model="editModule.configs[0].config.protocol" :disabled="!!editModule.id && editModule.configs[0].config.protocol === 'snmp'" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top right-box-public-dropdown prevent-clickoutside" size="small" value-key="id" @change="changeBasicType">
+                <el-select id="module-box-input-type" v-model="editModule.configs[0].config.protocol" :disabled="!!editModule.id && editModule.configs[0].config.protocol === 'snmp'" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" @change="changeBasicType">
                   <el-option v-for="item in typeList" :id="'module-type-'+item.id" :key="item.value" :label="item.name" :value="item.value" :disabled="item.disabled && !!editModule.id"></el-option>
                 </el-select>
               </el-form-item>
@@ -144,7 +144,7 @@
                 </el-row>
                     <!--credentials-->
               <el-form-item :label='$t("project.endpoint.credentials")' prop="credentials">
-                <el-select id="module-box-input-credentials" v-model="editModule.configs[0].config.snmpCredentialsId" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="id">
+                <el-select id="module-box-input-credentials" v-model="editModule.configs[0].config.snmpCredentialsId" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
                   <el-option v-for="item in credentialList" :id="'module-type-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
                 </el-select>
               </el-form-item>
@@ -229,7 +229,7 @@
                     </div>
                    <div>
                      <el-form-item :prop="'configs.0.config.relabel_config.' + index + '.action'" class="" :label="'Action'" :rules="[{ required: true, message: $t('validate.required'), trigger: 'change' }]">
-                       <el-select v-model="item.action" :id="'action' + index " class="right-box__select " placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" @change="actionChange(index)" :rules="[{ required: true, message: $t('validate.required'), trigger: 'change' }]">
+                       <el-select v-model="item.action" :id="'action' + index " class="right-box__select " placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="actionChange(index)" :rules="[{ required: true, message: $t('validate.required'), trigger: 'change' }]">
                          <el-option v-for="item2 in actionList" :id="'module-action-'+item2.label" :key="item2.label" :label="item2.label" :value="item2.value"></el-option>
                        </el-select>
                      </el-form-item>
@@ -300,7 +300,7 @@
             <el-tab-pane v-if="editModule.configs[0].config.protocol !== 'snmp'" :label="$t('project.endpoint.auth')" name="Auth">
               <!--authtype-->
               <el-form-item :label='$t("project.endpoint.type")' prop="authtype">
-                <el-select id="module-box-input-auth-type" v-model="authType" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top module-project-box-dropdown prevent-clickoutside" size="small" value-key="id" @change="changeAuthType">
+                <el-select id="module-box-input-auth-type" v-model="authType" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id" @change="changeAuthType">
                   <el-option v-for="item in authTypeList" :id="'module-type-'+item.id" :key="item.value" :label="item.name" :value="item.value"></el-option>
                 </el-select>
               </el-form-item>
@@ -336,7 +336,7 @@
                 <el-tab-pane :label="$t('project.endpoint.basic')" name="Basic">
                   <!--type-->
                   <el-form-item :label='$t("project.endpoint.type")' class="half-form-item">
-                    <el-select id="module-box-input-type" v-model="item.type" class="right-box__select" placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" @change="logsBasicTypeChange(index)">
+                    <el-select id="module-box-input-type" v-model="item.type" class="right-box__select" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="logsBasicTypeChange(index)">
                       <el-option v-for="item in logsBasicList" :id="'module-type-'+item.id" :key="item.value" :label="item.name" :value="item.value"></el-option>
                     </el-select>
                   </el-form-item>
@@ -476,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-top right-public-box-dropdown-top prevent-clickoutside" size="small">
+                        <el-select v-model="item2.format" :id="'timestamp' + index +'-' + index2" class="right-box__select" placeholder="" popper-class="right-box-select-top 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/pipelineSelect.vue b/nezha-fronted/src/components/common/rightBox/pipelineSelect.vue
index 51337cdc5..4544c2349 100644
--- a/nezha-fronted/src/components/common/rightBox/pipelineSelect.vue
+++ b/nezha-fronted/src/components/common/rightBox/pipelineSelect.vue
@@ -4,7 +4,7 @@
       id="module-box-logs-pipeline-type"
       class="right-box__select"
       placeholder=""
-      popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside pipeline"
+      popper-class="right-box-select-top prevent-clickoutside pipeline"
       size="small"
       ref="select"
       v-model="pipelineOptionValue"
diff --git a/nezha-fronted/src/components/common/rightBox/profileBox.vue b/nezha-fronted/src/components/common/rightBox/profileBox.vue
index 942715d85..734ff5c23 100644
--- a/nezha-fronted/src/components/common/rightBox/profileBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/profileBox.vue
@@ -35,7 +35,7 @@
                        clearable
                        collapse-tags
                        placeholder=""
-                       popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside"
+                       popper-class="right-box-select-top prevent-clickoutside"
                        size="small">
               <template v-for="item in languageList">
                 <el-option :key="item.value" :label="item.label" :value="item.value"></el-option>
diff --git a/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue b/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue
index a6ca58b2c..d3e58b45c 100644
--- a/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue
@@ -18,7 +18,7 @@
               <el-input placeholder="" maxlength="256" show-word-limit v-model="editCredential.remark" size="small" id="credential-box-input-remark"></el-input>
             </el-form-item>
             <el-form-item :label='$t("config.mib.credential.type")' prop="type">
-              <el-select v-model="editCredential.type" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside" @change="typeChange">
+              <el-select v-model="editCredential.type" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" @change="typeChange">
                 <el-option v-for="item in $CONSTANTS.snmpProtocolTypes" :key="item.value" :label="item.label" :value="item.value">
                   <span class="panel-dropdown-label-txt" >{{item.label}}</span>
                 </el-option>
@@ -44,7 +44,7 @@
             <div style="margin-bottom: 20px;width: 100%"></div>
 
             <el-form-item :label='$t("config.mib.credential.method")' prop="authProtocol"  v-if="editCredential.type === 3">
-              <el-select v-model="editCredential.config.authProtocol" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside">
+              <el-select v-model="editCredential.config.authProtocol" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside">
                 <el-option v-for="item in $CONSTANTS.snmpAuthMethod" :key="item.value" :label="item.label" :value="item.value">
                   <span class="panel-dropdown-label-txt" >{{item.label}}</span>
                 </el-option>
@@ -58,7 +58,7 @@
             <div style="margin-bottom: 20px;width: 100%"></div>
 
             <el-form-item :label='$t("config.mib.credential.method")' prop="privProtocol"  v-if="editCredential.type === 3">
-              <el-select v-model="editCredential.config.privProtocol" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside" :disabled="!editCredential.config.authProtocol || editCredential.config.authProtocol === ''">
+              <el-select v-model="editCredential.config.privProtocol" placeholder="" id="credential-box-input-type" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" :disabled="!editCredential.config.authProtocol || editCredential.config.authProtocol === ''">
                 <el-option v-for="item in $CONSTANTS.snmpEncryptionMethod" :key="item.value" :label="item.label" :value="item.value">
                   <span class="panel-dropdown-label-txt" >{{item.label}}</span>
                 </el-option>
diff --git a/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue b/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
index 056b9b414..fa961db2d 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 7f1cc5afc..4fe97303b 100644
--- a/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertRuleTable.vue
@@ -124,7 +124,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 b9140bb73..09d402380 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 0cb4b36db..ad2f332aa 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 3a8eb81df..c6a673cb2 100644
--- a/nezha-fronted/src/components/common/table/asset/assetTable.vue
+++ b/nezha-fronted/src/components/common/table/asset/assetTable.vue
@@ -122,7 +122,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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/nzDataList.vue b/nezha-fronted/src/components/common/table/nzDataList.vue
index f238993eb..6a51af19c 100644
--- a/nezha-fronted/src/components/common/table/nzDataList.vue
+++ b/nezha-fronted/src/components/common/table/nzDataList.vue
@@ -28,7 +28,7 @@
                       type="button">
                 <i class="nz-icon nz-icon-list-view" />
               </button>
-              <el-dropdown-menu slot="dropdown"  class="right-public-box-dropdown-top right-public-box-select-top">
+              <el-dropdown-menu slot="dropdown"  class="right-public-box-dropdown-top right-box-select-top">
                 <el-dropdown-item :command="'list'" :class="detailType === 'list' ? 'active' : ''">{{$t('asset.detail.list')}}</el-dropdown-item>
                 <el-dropdown-item :command="'view'" :class="detailType === 'view' ? 'active' : ''">{{$t('asset.detail.detail')}}</el-dropdown-item>
               </el-dropdown-menu>
diff --git a/nezha-fronted/src/components/common/table/settings/agentTable.vue b/nezha-fronted/src/components/common/table/settings/agentTable.vue
index 1f9fac524..517f482c7 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 189ed7b67..c707f9786 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 a85941fd6..8699063f5 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 38d108ce3..3074de3ad 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 bf3532432..425b5046d 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 aa842037d..cd1b8cf5e 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 b5083c202..dac7c9bff 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 1e2320d87..bc909bee4 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 d9ee8544a..198fc9f54 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 bc8aae306..faf6a86ad 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 5a16fa349..135c04aa0 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 ee57ec0bd..5ad3ee637 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 f74cdabce..8282e530e 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 5bafd3841..befb9fbd7 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" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 1ee5cc250..99dbd57c9 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" class="right-public-box-select-top right-public-box-dropdown-top">
+            <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
               <el-dropdown-item :command="['shutdown', scope.row]"><i class="nz-icon nz-icon-ZD"></i><span class="operation-dropdown-text">{{$t('config.terminallog.stop')}}</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" class="right-public-box-select-top right-public-box-dropdown-top">
+            <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 b8d96595a..ea5d121b6 100644
--- a/nezha-fronted/src/components/common/table/settings/userTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/userTable.vue
@@ -84,7 +84,7 @@
           <div class="table-operation-item table-operation-item--more">
             <i class="nz-icon nz-icon-more3"></i>
           </div>
-          <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 27ffcf61f..27feadcc1 100644
--- a/nezha-fronted/src/components/common/timePicker.vue
+++ b/nezha-fronted/src/components/common/timePicker.vue
@@ -90,7 +90,7 @@
   <div id="panel-calender" :class="{'calendar--small': size === 'small'}" class="calendar">
     <my-date-picker prefix-icon=" " class="panel-time-picker-hidden " size="mini" ref="calendar"
                     format="yyyy/MM/dd HH:mm:ss" @change="dateChange" v-model="searchTime" type="datetimerange"
-                    popper-class="panel-time-picker-popper"
+                    popper-class="panel-time-picker-popper time-picker-popover__select-top"
                     :range-separator="$t('dashboard.panel.to')"
                     :start-placeholder="$t('dashboard.panel.startTime')"
                     :end-placeholder="$t('dashboard.panel.endTime')" align="right">
@@ -107,7 +107,7 @@
         :visible-arrow="false"
         :disabled="isPopoverDisabled"
         trigger="hover"
-        popper-class="popper-z-index right-public-box-select-top right-public-box-dropdown-top"
+        popper-class="popper-z-index right-box-select-top right-public-box-dropdown-top"
         id="panel-calender-popover">
         <template v-if="this.searchTime&&this.searchTime.length>1">
           <el-row  :gutter="10" class="calendar-popover">
diff --git a/nezha-fronted/src/components/layout/header.vue b/nezha-fronted/src/components/layout/header.vue
index 590e314c5..94177acac 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 trigger="click">
         <div class="header-menu__item"><i class="nz-icon nz-icon-more-app"></i></div>
-        <el-dropdown-menu slot="dropdown" class="right-public-box-select-top right-public-box-dropdown-top">
+        <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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" class="right-public-box-select-top right-public-box-dropdown-top">
+        <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 trigger="click">
         <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" class="right-public-box-select-top right-public-box-dropdown-top" slot="dropdown">
+        <el-dropdown-menu  style="width: 142px" class="right-box-select-top right-public-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/alert/alertMessage.vue b/nezha-fronted/src/components/page/alert/alertMessage.vue
index 3210c016f..9799bdb1a 100644
--- a/nezha-fronted/src/components/page/alert/alertMessage.vue
+++ b/nezha-fronted/src/components/page/alert/alertMessage.vue
@@ -14,7 +14,7 @@
       v-loading="tools.loading"
     >
       <template v-slot:top-tool-right>
-        <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-public-box-select-top right-public-box-dropdown-top">
+        <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-box-select-top">
           <el-option v-for="item in stateOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
         </el-select>
         <button id="asset-filter" :class="[dataListLayout.indexOf('clickSearch') > -1?'is-focus':'' ]" class="top-tool-btn margin-r-10" @click.stop="showClickSearch">
diff --git a/nezha-fronted/src/components/page/config/agent.vue b/nezha-fronted/src/components/page/config/agent.vue
index a83cf041d..8f28901e5 100644
--- a/nezha-fronted/src/components/page/config/agent.vue
+++ b/nezha-fronted/src/components/page/config/agent.vue
@@ -50,7 +50,7 @@
           <div class="right-box-sub-title">{{$t('config.agent.agent.download')}}</div>
           <div style="margin-bottom: 20px;width: 100%"></div>
           <el-form-item :label="$t('config.agent.agent.osType')" class="half-form-item" prop="osType">
-            <el-select v-model="agentParam.osType" class="right-box-row-with-btn" popper-class="right-public-box-select-top agent-select right-public-box-dropdown-top" placeholder="">
+            <el-select v-model="agentParam.osType" class="right-box-row-with-btn" popper-class="right-box-select-top agent-select" placeholder="">
               <el-option v-for="item in osTypes" :key="item.name" :label="item.label" :value="item.name">
                 <span class="panel-dropdown-label-txt" >{{item.label}}</span>
               </el-option>
@@ -63,14 +63,14 @@
           <div style="margin-bottom: 20px;width: 100%"></div>
 
           <el-form-item :label="$t('config.dc.dc')" class="half-form-item" prop="dc">
-            <el-select v-model="agentParam.dc" class="right-box-row-with-btn" popper-class="right-public-box-select-top agent-select right-public-box-dropdown-top" placeholder="">
+            <el-select v-model="agentParam.dc" class="right-box-row-with-btn" popper-class="right-box-select-top agent-select" placeholder="">
               <el-option v-for="item in allDc" :key="item.id" :label="item.name" :value="item.id">
                 <span class="panel-dropdown-label-txt" >{{item.name}}</span>
               </el-option>
             </el-select>
           </el-form-item>
           <el-form-item :label="$t('config.agent.agent.type')" class="half-form-item" prop="type">
-            <el-select v-model="agentParam.type" class="right-box-row-with-btn" popper-class="right-public-box-select-top agent-select right-public-box-dropdown-top" placeholder="">
+            <el-select v-model="agentParam.type" class="right-box-row-with-btn" popper-class="right-box-select-top agent-select" placeholder="">
               <el-option v-for="item in agent2.theData" :key="item.value" :label="item.label" :value="item.value" :disabled="federationEnabled && item.value == 2">
                 <span class="panel-dropdown-label-txt" >{{item.label}}</span>
               </el-option>
diff --git a/nezha-fronted/src/components/page/config/mibBrowser.vue b/nezha-fronted/src/components/page/config/mibBrowser.vue
index 8a61aacf2..8f1437c22 100644
--- a/nezha-fronted/src/components/page/config/mibBrowser.vue
+++ b/nezha-fronted/src/components/page/config/mibBrowser.vue
@@ -23,7 +23,7 @@
           class="margin-r-20"
           placeholder="IP"
           size="small"
-          popper-class="mib-browser-right-box-dropdown right-public-box-select-top right-public-box-dropdown-top"
+          popper-class="mib-browser-right-box-dropdown right-box-select-top right-public-box-dropdown-top"
           style="width: 100%;"
           value-key="manageIp"
           @input="assetChange"
@@ -34,14 +34,14 @@
         </el-autocomplete>
         <el-input id="mib-browser-oid" v-model="searchParam.oid" class="margin-r-20" placeholder="OID" size="small"></el-input>
         <div class="margin-r-10" style="width: 50%">
-          <el-select id="mib-browser-host" v-model="searchParam.operation" size="small" popper-class="right-public-box-select-top right-public-box-dropdown-top">
+          <el-select id="mib-browser-host" v-model="searchParam.operation" size="small" popper-class="right-box-select-top">
             <el-option v-for="item in operationData" :key="item" :value="item"></el-option>
           </el-select>
         </div>
         <div class="top-tool-btn-group">
-          <el-popover :offset="-143" placement="bottom" trigger="hover" width="300">
+          <el-popover :offset="-143" placement="bottom" trigger="click" popper-class="right-box-select-top right-public-box-dropdown-top" width="300">
             <div class="mib-browser-ad-search">
-              <el-select v-model="searchParam.snmpCredentialId" placeholder="Select credential" popper-class="right-public-box-select-top right-public-box-dropdown-top" size="mini" style="width: 300px" value-key="id">
+              <el-select v-model="searchParam.snmpCredentialId" placeholder="Select credential" size="mini" style="width: 300px" value-key="id">
                 <el-option v-for="(item, index) in credentialData" :key="index" :label="item.name" :value="item.id"></el-option>
               </el-select>
             </div>
@@ -584,7 +584,7 @@ export default {
   line-height: 24px;
 }
 .mib-browser-ad-search {
-  width: 450px;
+  width: 300px;
 }
 .mib-browser-model-dropdown {
   height: 300px;
diff --git a/nezha-fronted/src/components/page/config/system/apiKeyTable.vue b/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
index 8c7ce6977..d657d0468 100644
--- a/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
+++ b/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
@@ -41,7 +41,7 @@
             </template>
             <template v-if="item.prop == 'role'">
               <el-popover :content="rules.roleId.message" placement="top" trigger="manual" v-model="rules.roleId.switch" popper-class="small-pop warn-pop" @after-enter="popShow(rules.roleId)">
-                <el-select v-model="scope.row[item.prop]" size="small" :placeholder="$t('el.select.placeholder')" value-key="id" slot="reference" popper-class="api-select right-public-box-select-top right-public-box-dropdown-top role-system-table">
+                <el-select v-model="scope.row[item.prop]" size="small" :placeholder="$t('el.select.placeholder')" value-key="id" slot="reference" popper-class="api-select right-box-select-top  role-system-table">
                   <template v-for="role in roles" >
                     <el-option :label="role.name" :value="role"></el-option>
                   </template>
@@ -58,7 +58,7 @@
                   format="yyyy-MM-dd HH:mm:ss"
                   value-format="yyyy-MM-dd HH:mm:ss"
                   type="datetime"
-                  popper-class="item-system-table right-public-box-dropdown-top right-public-box-select-top"
+                  popper-class="item-system-table right-public-box-dropdown-top right-box-select-top"
                   :picker-options="pickerOptions"
                   :placeholder="$t('el.datepicker.selectTime')">
                 </my-date-picker>
diff --git a/nezha-fronted/src/components/page/config/system/linkTable.vue b/nezha-fronted/src/components/page/config/system/linkTable.vue
index 08780371d..b8c2c828d 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" class="right-public-box-select-top right-public-box-dropdown-top">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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 fe1839785..671b6e92a 100644
--- a/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
+++ b/nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
@@ -46,7 +46,7 @@
             </template>
             <template v-if="item.prop == 'account'">
               <el-popover :content="rules.account.message" placement="top" trigger="manual" v-model="rules.account.switch" popper-class="small-pop warn-pop" @after-enter="popShow(rules.account)">
-                <el-select slot="reference" v-model="scope.row[item.prop]" :placeholder="$t('el.select.placeholder')" size="small" popper-class="right-public-box-select-top right-public-box-dropdown-top">
+                <el-select slot="reference" v-model="scope.row[item.prop]" :placeholder="$t('el.select.placeholder')" size="small" popper-class="right-box-select-top ">
                   <template v-for="param in accountParams">
                     <el-option :label="param.label" :value="param.value"></el-option>
                   </template>
@@ -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" class="right-public-box-select-top right-public-box-dropdown-top">
+              <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-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/alertChartParam.vue b/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
index 09699fa94..cd5fbe093 100644
--- a/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
+++ b/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
@@ -7,16 +7,16 @@
           :options="options"
           :props="props"
           class="form-item"
-          popper-class="alert-form-pop right-public-box-select-top right-public-box-dropdown-top no-style-class"
+          popper-class="alert-form-pop right-box-select-top right-public-box-dropdown-top no-style-class"
           clearable></el-cascader>
       </el-form-item>
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.alertRule')">
-        <el-select class="form-item" size="small" :placeholder="$t('el.select.placeholder')" popper-class="alert-form-pop right-public-box-dropdown-top right-public-box-select-top no-style-class" v-model="parameters.alertRule" clearable id="alert-param-alertrule">
+        <el-select class="form-item" size="small" :placeholder="$t('el.select.placeholder')" popper-class="alert-form-pop right-box-select-top no-style-class" v-model="parameters.alertRule" clearable id="alert-param-alertrule">
           <el-option v-for="(rule, index) in alertRules" :key="index" :label="rule.name" :value="rule.id"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.level')" prop="level" class="severity-box">
-        <el-select class="form-item" size="small" :placeholder="$t('el.select.placeholder')" popper-class="alert-form-pop right-public-box-select-top right-public-box-dropdown-top no-style-class" v-model="parameters.level" clearable id="alert-param-level">
+        <el-select class="form-item" size="small" :placeholder="$t('el.select.placeholder')" popper-class="alert-form-pop right-box-select-top no-style-class" v-model="parameters.level" clearable id="alert-param-level">
           <el-option v-for="item in alertPriority" :id="'alert-severity-'+item.value" :key="item.id" :label="item.name" :value="item.id">
               <span>
                  <i class="nz-icon nz-icon-circle" :style="{color:item.color,'font-size':'12px'}"></i> {{item.name}}
@@ -26,7 +26,7 @@
         <i class="nz-icon nz-icon-circle severity-circle" v-if="parameters.level" :style="{color: alertPriority.length > 0 && alertPriority.find(severity => severity.id ===  parameters.level).color,'font-size':'12px'}"></i>
       </el-form-item>
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.state')">
-        <el-select class="form-item" size="small" popper-class="alert-form-pop right-public-box-select-top right-public-box-dropdown-top no-style-class" v-model="parameters.state" clearable id="alert-param-state">
+        <el-select class="form-item" size="small" popper-class="alert-form-pop right-box-select-top no-style-class" v-model="parameters.state" clearable id="alert-param-state">
           <el-option v-for="(item, index) in states" :key="index" :label="item.label" :value="item.value"></el-option>
         </el-select>
       </el-form-item>
diff --git a/nezha-fronted/src/components/page/dashboard/chartBox.vue b/nezha-fronted/src/components/page/dashboard/chartBox.vue
index 9de4604d7..aab8faf0e 100644
--- a/nezha-fronted/src/components/page/dashboard/chartBox.vue
+++ b/nezha-fronted/src/components/page/dashboard/chartBox.vue
@@ -213,7 +213,7 @@
 
             <!--group-->
             <el-form-item :label="$t('dashboard.panel.chartForm.group')" class="form-item--half-width" prop="group">
-              <el-select id="chart-box-group" v-model="editChart.groupId" :disabled="editChart.type==='group'" clearable placeholder="" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" size="small" value-key="chartType">
+              <el-select id="chart-box-group" v-model="editChart.groupId" :disabled="editChart.type==='group'" clearable placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="chartType">
                 <el-option v-for="item in groupArr" :key="item.id" :label="item.name" :value="item.id">
                   <span class="panel-dropdown-label-txt" >{{item.name}}</span>
                 </el-option>
@@ -223,7 +223,7 @@
 
           <!--   varType   -->
           <el-form-item :label="$t('dashboard.panel.chartForm.varType')" v-if="from === 'chartTemp'">
-            <el-select id="chart-box-group" v-model="editChart.varType" :disabled="!!editChart.id" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" clearable placeholder="" size="small" value-key="chartType">
+            <el-select id="chart-box-group" v-model="editChart.varType" :disabled="!!editChart.id" class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" clearable placeholder="" size="small" value-key="chartType">
               <el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in varTypeArr">
                 <span class="panel-dropdown-label-txt" >{{item.name}}</span>
               </el-option>
@@ -274,7 +274,7 @@
             <el-form-item v-show="editChart.type !='text' && editChart.type !=='url'&& editChart.type !=='group'&& editChart.type !=='diagram'" :label="$t('dashboard.panel.chartForm.unit')" class="form-item--half-width" prop="unit">
               <el-cascader id="chart-box-unit" v-model="editChart.unit" :options="unitOptions" :props="{ expandTrigger: 'hover',emitPath:false }"  :show-all-levels="false" filterable
                            placeholder=""
-                           popper-class="dc-dropdown right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside chart-box-unit"
+                           popper-class="dc-dropdown right-box-select-top right-public-box-dropdown-top prevent-clickoutside chart-box-unit"
                            size="small"
                            style="width: 100%"
                            @change="unitSelected"
diff --git a/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue b/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue
index 2945e9520..819863785 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 right-public-box-select-top right-public-box-dropdown-top" placement="bottom-end" slot="dropdown">
+                <el-dropdown-menu style="width: 118px" class="el-dropdown__width right-box-select-top right-public-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"
diff --git a/nezha-fronted/src/components/page/dashboard/explore/logTab.vue b/nezha-fronted/src/components/page/dashboard/explore/logTab.vue
index fe872b3b7..4f05c8e52 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/logTab.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/logTab.vue
@@ -29,7 +29,7 @@
       </div>
       <div class="log-operation">
         <span class="operation-label">{{$t('overall.limit')}}:</span>
-        <el-select v-model="limit" size="small" style="width: 100px;" popper-class="right-public-box-select-top right-public-box-dropdown-top">
+        <el-select v-model="limit" size="small" style="width: 100px;" popper-class="right-box-select-top ">
           <el-option v-for="option in limitOptions" :key="option" :value="option"></el-option>
         </el-select>
       </div>