diff --git a/nezha-fronted/src/components/common/project/popData/assetTable.vue b/nezha-fronted/src/components/common/project/popData/assetTable.vue
index 71cbc8f6b..633c775d3 100644
--- a/nezha-fronted/src/components/common/project/popData/assetTable.vue
+++ b/nezha-fronted/src/components/common/project/popData/assetTable.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="mc" @click.self="clickOutside">
-    <div class="right-box right-box-project-alert">
+    <div class="right-box right-box-project-asset">
       <div class="right-box-title">{{ moduleName }} / {{$t('asset.asset')}}</div>
       <nz-data-list
         ref="dataList"
diff --git a/nezha-fronted/src/components/common/project/popData/endpointTable.vue b/nezha-fronted/src/components/common/project/popData/endpointTable.vue
index c5baf3dd0..a1b847b7d 100644
--- a/nezha-fronted/src/components/common/project/popData/endpointTable.vue
+++ b/nezha-fronted/src/components/common/project/popData/endpointTable.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="mc" @click.self="clickOutside">
-    <div class="right-box right-box-project-alert">
+    <div class="right-box right-box-project-endpoint">
       <div class="right-box-title">{{ moduleName }} / {{$t('project.endpoint.endpoints')}}</div>
       <nz-data-list
         ref="dataList"
diff --git a/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue b/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue
index 444aab644..3ab7293a0 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editAssetType, func: esc}" class="right-box right-box-asset">
+  <div v-clickoutside="{obj: editAssetType, func: esc}" class="right-box right-box-asset-type">
     <div class="right-box__header">
       <div class="header__title">{{editAssetType.id ? $t('config.assetType.editAssetType') : $t('config.assetType.createModel')}}</div>
       <div class="header__operation">
diff --git a/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue b/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
index 1edac3dcd..405625698 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editModel, func: esc}" class="right-box right-box-asset">
+  <div v-clickoutside="{obj: editModel, func: esc}" class="right-box right-box-model">
     <div class="right-box__header">
       <div class="header__title">{{editModel.id ? $t('config.model.editModel') : $t('config.model.createModel')}}</div>
       <div class="header__operation">
diff --git a/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue b/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue
index 9f36b2c50..e13f47bfa 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editRole, func: esc}" class="right-box right-box-asset">
+  <div v-clickoutside="{obj: editRole, func: esc}" class="right-box right-box-role">
     <div class="right-box__header">
       <div class="header__title">{{editRole.id ? $t('config.roles.editRole') : $t('config.roles.createRole')}}</div>
       <div class="header__operation">
diff --git a/nezha-fronted/src/components/common/rightBox/administration/userBox.vue b/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
index 5fc9fee14..0b8da0a1b 100644
--- a/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editUser, func: esc}" class="right-box right-box-asset">
+  <div v-clickoutside="{obj: editUser, func: esc}" class="right-box right-box-user">
     <div class="right-box__header">
       <div class="header__title">{{editUser.id ? $t('config.user.editUser') : $t('config.user.createUser')}}</div>
       <div class="header__operation">
diff --git a/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue b/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
index 122aeb7e0..a6906f683 100644
--- a/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editAlertRule, func: clickOutside}" class="right-box right-box-alert-config">
+  <div v-clickoutside="{obj: editAlertRule, func: clickOutside}" class="right-box right-box-alert-rule">
     <div class="right-box__header">
       <!-- begin--标题-->
       <div class="header__title">{{alertRule.id ? $t("alert.config.editAlertConfig") : $t("alert.config.createAlertConfig")}}</div>
diff --git a/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue b/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue
index 03eb68f4b..49106bd3e 100644
--- a/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="right-box right-box-alert-config" v-clickoutside="{obj:editAlertSilence,func:clickOutside}">
+  <div class="right-box right-box-alert-silence" v-clickoutside="{obj:editAlertSilence,func:clickOutside}">
     <!-- begin--标题-->
     <div class="right-box__header">
       <div class="header__title">{{editAlertSilence.id ? $t("alert.silence.edit") : $t("alert.silence.create")}}</div>
diff --git a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
index c0a2e7522..8a3a3fd37 100644
--- a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
@@ -1,6 +1,6 @@
 <template>
   <transition name="right-box-580">
-    <div class="right-box right-box-asset" v-clickoutside="{obj:editAssetMeta,func:clickOutside}">
+    <div class="right-box right-box-asset-meta" v-clickoutside="{obj:editAssetMeta,func:clickOutside}">
       <!-- begin--标题-->
       <div class="right-box__header">
         <div class="header__title">{{editAssetMeta.id ? $t("config.assetLabel.editMeta"): $t("config.assetLabel.addMeta")}}
diff --git a/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue b/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue
index 6b5f3f34d..81a8ab9e2 100644
--- a/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue
@@ -1,6 +1,6 @@
 <template>
   <transition name="right-box-580">
-    <div class="right-box right-box-panel z-top" v-clickoutside="{obj:editMetaGroup,func:clickOutside}">
+    <div class="right-box right-box-asset-meta-group z-top" v-clickoutside="{obj:editMetaGroup,func:clickOutside}">
       <!-- begin--顶部按钮-->
       <div class="right-box-top-btns right-box-form-delete">
         <button @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien" id="alert-box-del" type="button"
diff --git a/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue b/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
index a25a703fc..d490654cb 100644
--- a/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
+++ b/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="right-box right-box-add-endpoint" v-clickoutside="{obj:endpoint,func:clickOutside}">
+  <div class="right-box right-box-modify-endpoint" v-clickoutside="{obj:endpoint,func:clickOutside}">
     <div class="right-box__header">
       <!-- begin--标题-->
       <div class="header__title">{{$t("overall.batchEndpoint")}}</div>
@@ -955,7 +955,7 @@ export default {
   .el-table__row.hide-row{
     display: none !important;
   }
-  .right-box-add-endpoint {
+  .right-box-modify-endpoint {
     .right-box-form>.el-form-item {
       margin-left: 0;
     }
diff --git a/nezha-fronted/src/components/common/rightBox/chartTempBox.vue b/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
index ede50b58b..3ec0f2e87 100644
--- a/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editChartTemp, func: esc}" class="right-box right-box-asset">
+  <div v-clickoutside="{obj: editChartTemp, func: esc}" class="right-box right-box-chart-temp">
     <div class="right-box__header">
       <div class="header__title">{{editChartTemp.id ? $t('dashboard.panel.createChartByTemp') :$t('dashboard.panel.createChartByTemp')}}</div>
       <div class="header__operation">
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
index ff0dde259..74ff2c8ed 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="right-box right-box-module" v-clickoutside="{obj:editEndpoint,func:clickOutside}">
+  <div class="right-box right-box-edit-endpoint" v-clickoutside="{obj:editEndpoint,func:clickOutside}">
     <div class="right-box__header">
       <!-- begin--标题-->
       <div class="header__title">
diff --git a/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue b/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
index 0a18423df..9d1cb6134 100644
--- a/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj:editExprTemp,func:clickOutside}" class="right-box right-box-alert-config">
+  <div v-clickoutside="{obj:editExprTemp,func:clickOutside}" class="right-box right-box-alert-expr">
     <!-- begin--标题-->
     <div class="right-box__header">
       <div class="header__title">{{editExprTemp.id ? $t("config.exprTemp.edit"):
diff --git a/nezha-fronted/src/components/common/rightBox/setting/cabinetBox.vue b/nezha-fronted/src/components/common/rightBox/setting/cabinetBox.vue
index f50f533fd..66f89d568 100644
--- a/nezha-fronted/src/components/common/rightBox/setting/cabinetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/setting/cabinetBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-clickoutside="{obj: editCabinet, func: esc}" class="right-box right-box-asset">
+  <div v-clickoutside="{obj: editCabinet, func: esc}" class="right-box right-setting-box-cabinet">
     <div class="right-box__header">
       <div class="header__title">{{editCabinet.id ? $t('config.cabinet.editCabinet') : $t('config.cabinet.createCabinet')}}</div>
       <div class="header__operation">
diff --git a/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue b/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
index d33ce182b..7af168599 100644
--- a/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="right-box right-box-project" v-clickoutside="{obj:traffic,func:clickOutside}" >
+  <div class="right-box right-box-traffic-setting " v-clickoutside="{obj:traffic,func:clickOutside}" >
 
     <!-- begin--标题-->
     <div class="right-box-title">{{$t('config.dc.traffic.title')}}</div>