From 1e80a050333893475cb38c88df68bfbc61db13d1 Mon Sep 17 00:00:00 2001
From: "@changcode" <changyongqiang@geedgenetworks.com>
Date: Sun, 26 Sep 2021 09:14:07 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E4=B8=8B=E6=8B=89=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/assets/css/common/rightBoxCommon.scss  | 18 ++++++++++++++++--
 .../bottomBox/tabs/alertMessageTabNew.vue      |  2 +-
 .../rightBox/asset/assetBatchEditBox.vue       |  2 +-
 .../common/rightBox/asset/assetBox.vue         |  2 +-
 .../src/components/page/alert/alertMessage.vue |  2 +-
 .../src/components/page/config/mibBrowser.vue  |  3 ++-
 .../src/components/page/config/system.vue      | 12 ++++++------
 7 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
index 14144b37d..65796c220 100644
--- a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
+++ b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
@@ -326,13 +326,27 @@
 .right-box-public-alert-dropdown {
   width: 320px;
 }
-.right-public-box-dropdown,.right-box-public-dropdown,.right-public-box-dropdown-width,.right-box-select-dropdown,.right-box-public-alert-dropdown {
+.mib-browser-right-box-dropdown {
+  width: 236px;
+}
+.right-public-box-dropdown,
+.right-box-public-dropdown,
+.right-public-box-dropdown-width,
+.right-box-select-dropdown,
+.right-box-public-alert-dropdown,
+.asset-right-box-dropdown-width,
+.mib-browser-right-box-dropdown,
+.right-box-select-top {
   margin-top: 0 !important;
   margin-bottom: 0 !important;
   .popper__arrow {
     opacity: 0;
   }
 }
-.right-box-dropdown-top.right-box-select-dropdown,.right-public-box-dropdown.right-box-dropdown-top,.dc-dropdown.right-box-dropdown-top {
+.right-box-dropdown-top.right-box-select-dropdown,
+.right-public-box-dropdown.right-box-dropdown-top,
+.dc-dropdown.right-box-dropdown-top,
+.mib-browser-right-box-dropdown.right-box-dropdown-top,
+.right-box-select-top.right-box-dropdown-top {
   margin: 5px 0 !important;
 }
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
index 25252233a..874537a50 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
@@ -14,7 +14,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">
+        <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-box-select-top right-box-dropdown-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/rightBox/asset/assetBatchEditBox.vue b/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
index 506c52e2e..8baef2ced 100644
--- a/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
@@ -161,7 +161,7 @@
                 :options="fieldGroupData"
                 :props="labelCascProp"
                 class="hide-input"
-                popper-class="prevent-clickoutside right-box-dropdown-top right-public-box-dropdown-width limit-height"
+                popper-class="prevent-clickoutside right-box-dropdown-top asset-right-box-dropdown-width limit-height"
                 size="small"
                 @change="addLabel"
               ></el-cascader>
diff --git a/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue b/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
index 24051dbae..59afe3bf0 100644
--- a/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
@@ -166,7 +166,7 @@
               :options="options.fieldGroupOptions"
               :props="labelCascProp"
               class="hide-input"
-              popper-class="prevent-clickoutside right-box-dropdown-top right-public-box-dropdown-width limit-height"
+              popper-class="prevent-clickoutside right-box-dropdown-top asset-right-box-dropdown-width limit-height"
               size="small"
               @change="addLabel"
             ></el-cascader>
diff --git a/nezha-fronted/src/components/page/alert/alertMessage.vue b/nezha-fronted/src/components/page/alert/alertMessage.vue
index 0c10ef6dd..4a2b241c5 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">
+        <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-box-select-top right-box-dropdown-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="searchTime" :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/page/config/mibBrowser.vue b/nezha-fronted/src/components/page/config/mibBrowser.vue
index 1e895f3cb..5d47711e0 100644
--- a/nezha-fronted/src/components/page/config/mibBrowser.vue
+++ b/nezha-fronted/src/components/page/config/mibBrowser.vue
@@ -23,6 +23,7 @@
           class="margin-r-20"
           placeholder="IP"
           size="small"
+          popper-class="mib-browser-right-box-dropdown right-box-dropdown-top"
           style="width: 100%;"
           value-key="manageIp"
           @input="assetChange"
@@ -33,7 +34,7 @@
         </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">
+          <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>
diff --git a/nezha-fronted/src/components/page/config/system.vue b/nezha-fronted/src/components/page/config/system.vue
index ef4c5d634..4895dfdb7 100644
--- a/nezha-fronted/src/components/page/config/system.vue
+++ b/nezha-fronted/src/components/page/config/system.vue
@@ -32,7 +32,7 @@
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.timezone')" prop="timezone">
               <!--                <el-input v-model.number="basic.timezone" ></el-input>-->
-              <el-select v-model="basic.timezone" id="system-baisc-timezone" filterable>
+              <el-select v-model="basic.timezone" id="system-baisc-timezone" filterable popper-class="right-box-select-top">
                 <el-option v-for="(item,index) in timezoneOption" :key="index" :label="item.name" :value="item.name" >
                   <div style="display: flex;justify-content: space-between;padding: 5px;">
                     <div >{{item.name}}</div>
@@ -93,7 +93,7 @@
               </el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.monitor.asset_ping_from')" prop="asset_ping_from">
-              <el-select v-model="monitor.asset_ping_from">
+              <el-select v-model="monitor.asset_ping_from" popper-class="right-box-select-top">
                 <el-option label="Global" value="1"></el-option>
                 <el-option label="Per-datacenter" value="2"></el-option>
               </el-select>
@@ -106,7 +106,7 @@
               </el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.monitor.metrics_storage_type')" prop="metrics_storage_type">
-              <el-select v-model="monitor.metrics_storage_type">
+              <el-select v-model="monitor.metrics_storage_type" popper-class="right-box-select-top">
                 <el-option :label="$t('config.system.monitor.local')" value="1"></el-option>
                 <el-option :label="$t('config.system.monitor.s3')" value="2"></el-option>
               </el-select>
@@ -143,7 +143,7 @@
               </el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.monitor.logs_storage_type')" prop="logs_storage_type">
-              <el-select v-model="monitor.logs_storage_type">
+              <el-select v-model="monitor.logs_storage_type" popper-class="right-box-select-top">
                 <el-option :label="$t('config.system.monitor.local')" value="1"></el-option>
                 <el-option :label="$t('config.system.monitor.s3')" value="2"></el-option>
               </el-select>
@@ -216,7 +216,7 @@
               <div class="el-form-item__tip">{{$t("config.system.email.testAccountTip")}}</div>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.securityType')" prop="email_security_type">
-              <el-select v-model="email.email_security_type" :disabled="email.email_enable == 'off'">
+              <el-select v-model="email.email_security_type" :disabled="email.email_enable == 'off'" popper-class="right-box-select-top">
                 <el-option label="None" value="NONE"></el-option>
                 <el-option label="SSL" value="SSL"></el-option>
                 <el-option label="TLS" value="TLS"></el-option>
@@ -323,7 +323,7 @@
 <!--                  </label>-->
 <!--                </div>-->
 <!--              </div>-->
-              <el-select v-model="reset.type" multiple>
+              <el-select v-model="reset.type" multiple popper-class="right-box-select-top">
                 <template v-for="item in resetOptions" >
                   <el-option :label="item.label" :value="item.value" :key="item.label"></el-option>
                 </template>