diff --git a/nezha-fronted/src/components/common/language/cn.js b/nezha-fronted/src/components/common/language/cn.js
index 85ec00914..e46fafe65 100644
--- a/nezha-fronted/src/components/common/language/cn.js
+++ b/nezha-fronted/src/components/common/language/cn.js
@@ -1174,7 +1174,8 @@ const cn = {
       editEndpoint: '编辑 Endpoint',
       createEndpoint: '新增Endpoint',
       batchEndpoint: '批量 Endpoint',
-      endpointName: 'Endpoint name'
+      endpointName: 'Endpoint name',
+      name: '名称'
     },
     endpoint: {
       createEndpoint: '新增Endpoint',
diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js
index 1a8fd3c3a..6da0f527c 100644
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -109,6 +109,7 @@ const en = {
     parent: 'Parent',
     dc: 'Data center',
     labels: 'Labels',
+    moreOption: 'More option',
     silence: 'Silence'
   },
   pageSize: '/page',
@@ -1161,7 +1162,7 @@ const en = {
       endpointInfo: 'Endpoint information'
     },
     project: {
-      project: 'Project', // "系统"
+      project: 'Name', // "系统"
       projectName: 'Project name', // "系统名称"
       editProject: 'Edit project', // "编辑系统"
       description: 'Description', // "描述"
@@ -1169,7 +1170,7 @@ const en = {
     },
     module: {
       module: 'Module', // "组件"
-      moduleName: 'Module name', // "组件名称"
+      moduleName: 'Name', // "组件名称"
       editModule: 'Edit module', // "编辑组件"
       description: 'Description', // "描述"
       createModule: 'New module', // "新增组件"
@@ -1191,6 +1192,7 @@ const en = {
       createEndpoint: 'New endpoint',
       batchEndpoint: 'Batch Endpoint',
       endpointName: 'Endpoint name',
+      name: 'Name',
       tip: {
         defaultEndpointSet: 'Default endpoint settings', // "默认的Endpoint设置"
         relation: 'Module associated Endpoint will configure the following ports/paths/parameters by default'// "组件关联的Endpoint将默认配置以下端口/路径/参数"
diff --git a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
index 39e761c72..c340b111d 100644
--- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
@@ -185,11 +185,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns right-box__footer">
-      <button v-cancel="{obj:endpoint,func:esc}" id="ep-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:endpoint,func:esc}" id="ep-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="ep-add">
+      <button @click="save" class="footer__btn" id="ep-add">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/agentBox.vue b/nezha-fronted/src/components/common/rightBox/agentBox.vue
index abe450ca1..1920627fb 100644
--- a/nezha-fronted/src/components/common/rightBox/agentBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/agentBox.vue
@@ -2,7 +2,7 @@
   <div v-clickoutside="{obj:editPromServer,func:clickOutside}" class="right-box right-box-prom">
     <!-- begin--标题-->
     <div class="right-box__header">
-      <div class="header__title">{{editPromServer.id ? ($t("config.agent.editProm") + "  ID：" + editPromServer.id) : $t("config.agent.createProm")}}</div>
+      <div class="header__title">{{editPromServer.id ? ($t("config.agent.editProm")) : $t("config.agent.createProm")}}</div>
       <div class="header__operation">
         <span v-cancel="{obj: editPromServer, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
       </div>
@@ -55,17 +55,17 @@
           </el-form-item>
         </el-form>
       </div>
-      
+
     </div>
     <!-- end--表单-->
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
+    <div class="right-box__footer">
       <button id="prom-esc" v-cancel="{obj:editPromServer,func:esc}"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+              class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
       <button id="prom-save" :class="{'nz-btn-disabled':prevent_opt.save}"
-              :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" @click="save">
+              :disabled="prevent_opt.save" class="footer__btn" @click="save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue b/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
index 0ea21a780..d01cc19e4 100644
--- a/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertRuleBox.vue
@@ -108,11 +108,11 @@
     <!-- end--表单-->
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button id="alert-box-esc" v-cancel="{obj:editAlertRule,func:esc}" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button id="alert-box-esc" v-cancel="{obj:editAlertRule,func:esc}" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button id="alert-box-save" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" @click="save">
+      <button id="alert-box-save" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="footer__btn" @click="save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue b/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue
index bc942a08a..0c42174e9 100644
--- a/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue
@@ -97,13 +97,13 @@
     <!-- end--表单-->
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns right-box__footer">
+    <div class="right-box__footer">
       <button v-cancel="{obj:editAlertSilence,func:esc}" id="alert-box-esc"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+              class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
       <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="alert-box-save">
+              class="footer__btn" id="alert-box-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/assetBox.vue b/nezha-fronted/src/components/common/rightBox/assetBox.vue
index 8c4a9b348..4fc77521d 100644
--- a/nezha-fronted/src/components/common/rightBox/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetBox.vue
@@ -9,7 +9,7 @@
       </button>
     </div>
 
-    <div class="right-box-title">{{editAsset.id ? ($t("asset.editAsset") + "  ID：" + editAsset.id) : $t("asset.createAsset")}}</div>
+    <div class="right-box-title">{{editAsset.id ? ($t("asset.editAsset")) : $t("asset.createAsset")}}</div>
 
     <div class="right-box-form-box">
       <el-form ref="assetEditForm" :model="editAsset" label-width="120px" class="right-box-form right-box-form-left" :rules="rules" label-position = "top">
@@ -149,11 +149,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editAsset,func:esc}" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" id="asset-edit-cancel">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editAsset,func:esc}" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="asset-edit-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="asset-edit-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
index 4d0766e79..f2a7e179c 100644
--- a/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetMetaBox.vue
@@ -3,8 +3,7 @@
     <div class="right-box right-box-asset" v-clickoutside="{obj:editAssetMeta,func:clickOutside}">
       <!-- begin--标题-->
       <div class="right-box__header">
-        <div class="header__title">{{editAssetMeta.id ? $t("config.assetLabel.editMeta") + " ID：" + editAssetMeta.id :
-          $t("config.assetLabel.addMeta")}}
+        <div class="header__title">{{editAssetMeta.id ? $t("config.assetLabel.editMeta"): $t("config.assetLabel.addMeta")}}
         </div>
         <div class="header__operation">
           <span v-cancel="{obj: editAssetMeta, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
@@ -127,11 +126,11 @@
       <!-- end--表单-->
 
       <!-- begin--底部按钮-->
-      <div class="right-box-bottom-btns">
-        <button v-cancel="{obj:editAssetMeta,func:esc}" id="editAssetMeta-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+      <div class="right-box__footer">
+        <button v-cancel="{obj:editAssetMeta,func:esc}" id="editAssetMeta-box-esc" class="footer__btn footer__btn--light">
           <span>{{$t('overall.cancel')}}</span>
         </button>
-        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="editAssetMeta-box-save">
+        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="editAssetMeta-box-save">
           <span>{{$t('overall.save')}}</span>
         </button>
       </div>
diff --git a/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue b/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue
index 5561a96ec..9ab3ebeff 100644
--- a/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetMetaGroup.vue
@@ -12,7 +12,7 @@
       <!-- end--顶部按钮-->
 
       <!-- begin--标题-->
-      <div class="right-box-title">{{editMetaGroup.id ? $t("config.assetMeta.editGroup") + " ID：" + editMetaGroup.id :
+      <div class="right-box-title">{{editMetaGroup.id ? $t("config.assetMeta.editGroup") :
         $t("config.assetMeta.addGroup")}}
       </div>
       <!-- end--标题-->
@@ -31,11 +31,11 @@
       <!-- end--表单-->
 
       <!-- begin--底部按钮-->
-      <div class="right-box-bottom-btns">
-        <button v-cancel="{obj:editMetaGroup,func:esc}" id="editMetaGroup-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+      <div class="right-box__footer">
+        <button v-cancel="{obj:editMetaGroup,func:esc}" id="editMetaGroup-box-esc" class="footer__btn footer__btn--light">
           <span>{{$t('overall.cancel')}}</span>
         </button>
-        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="editMetaGroup-box-save">
+        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="editMetaGroup-box-save">
           <span>{{$t('overall.save')}}</span>
         </button>
       </div>
diff --git a/nezha-fronted/src/components/common/rightBox/assetStateBox.vue b/nezha-fronted/src/components/common/rightBox/assetStateBox.vue
index b468ba929..9f8d8d14b 100644
--- a/nezha-fronted/src/components/common/rightBox/assetStateBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetStateBox.vue
@@ -12,7 +12,7 @@
     <!-- end--顶部按钮-->
 
     <!-- begin--标题-->
-    <div class="right-box-title">{{editAssetState.id ? ($t("config.assetState.editAssetState") + "  ID：" + editAssetState.id) : $t("config.assetState.createAssetState")}}</div>
+    <div class="right-box-title">{{editAssetState.id ? ($t("config.assetState.editAssetState")) : $t("config.assetState.createAssetState")}}</div>
     <!-- end--标题-->
 
     <!-- begin--表单-->
@@ -48,12 +48,12 @@
     </div>
     <!-- end--表单-->
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" id="asset-state-esc"
+    <div class="right-box__footer">
+      <button class="footer__btn footer__btn--light" id="asset-state-esc"
               v-cancel="{obj: editAssetState, func: esc}">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
+      <button @click="save" class="footer__btn"
               id="asset-state-save"
       >
         <span>{{$t('overall.save')}}</span>
diff --git a/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue b/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
index 105f5519a..d11de4e44 100644
--- a/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
+++ b/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
@@ -242,11 +242,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editAsset,func:esc}" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" id="asset-edit-cancel">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editAsset,func:esc}" class="footer__btn footer__btn--light" id="asset-edit-cancel">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="asset-edit-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="asset-edit-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue b/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
index cb9880b1a..37b84d9df 100644
--- a/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
+++ b/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
@@ -98,11 +98,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns right-box__footer">
-      <button v-cancel="{obj:endpoint,func:esc}" id="ep-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:endpoint,func:esc}" id="ep-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="ep-add">
+      <button @click="save" class="footer__btn" id="ep-add">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/cabinetBox.vue b/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
index 6de7491d4..f9f3e4ce0 100644
--- a/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
@@ -10,7 +10,7 @@
     <!-- end--顶部按钮-->
 
     <!-- begin--标题-->
-    <div class="right-box-title">{{editCabinet.id ? $t("config.dc.editCabinet") + " ID: " + editCabinet.id : $t("overall.createCabinet")}}</div>
+    <div class="right-box-title">{{editCabinet.id ? $t("config.dc.editCabinet") : $t("overall.createCabinet")}}</div>
     <!-- end--标题-->
 
     <!-- begin--表单-->
@@ -32,11 +32,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editCabinet,func:esc}" id="cab-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editCabinet,func:esc}" id="cab-box-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="cab-box-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="cab-box-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/dcBox.vue b/nezha-fronted/src/components/common/rightBox/dcBox.vue
index 8c5d4a0f5..115f3533b 100644
--- a/nezha-fronted/src/components/common/rightBox/dcBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/dcBox.vue
@@ -2,7 +2,7 @@
   <div class="right-box right-box-dc" v-clickoutside="{obj:editDc,func:clickOutside}">
       <!-- begin--标题-->
       <div class="right-box__header">
-        <div class="header__title">{{editDc.id ? ($t("config.dc.editDc") + "  ID：" + editDc.id) : $t("config.dc.createDc")}}</div>
+        <div class="header__title">{{editDc.id ? ($t("config.dc.editDc")) : $t("config.dc.createDc")}}</div>
         <div class="header__operation">
           <span v-cancel="{obj: editDc, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
         </div>
@@ -52,11 +52,11 @@
       </div>
 
       <!--底部按钮-->
-      <div class="right-box-bottom-btns">
-        <button v-cancel="{obj:editDc,func:esc}" id="dc-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+      <div class="right-box__footer">
+        <button v-cancel="{obj:editDc,func:esc}" id="dc-box-esc" class="footer__btn footer__btn--light">
           <span>{{$t('overall.cancel')}}</span>
         </button>
-        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="dc-box-save">
+        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="dc-box-save">
           <span>{{$t('overall.save')}}</span>
         </button>
       </div>
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
index 121f2ef52..08aa50c8b 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
@@ -124,11 +124,11 @@
     <!-- end--表单-->
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editEndpoint,func:esc}" id="ep-edit-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editEndpoint,func:esc}" id="ep-edit-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="ep-edit-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="ep-edit-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
index 80c5bd42e..09d961bc0 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -4,7 +4,7 @@
       <!-- begin--标题-->
       <div class="right-box-title">
       <span v-if="optionType === 'edit'">
-       {{ $t("project.module.editEndpoint")}} {{editEndpoint.id}}
+       {{ $t("project.module.editEndpoint")}}
       </span>
         <span v-if="optionType === 'batch'">
        {{ $t("project.module.batchEndpoint")}}
@@ -23,7 +23,7 @@
     <div class="right-box-form-box  right-box__container" ref="scrollbar">
       <el-form class="right-box-form right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="moduleForm">
         <!--name-->
-        <el-form-item :label='$t("project.module.endpointName")' prop="name" label-width="125px" v-if="optionType!=='batch'">
+        <el-form-item :label='$t("project.module.name")' prop="name" label-width="125px" v-if="optionType!=='batch'">
           <el-input placeholder="" maxlength="64" show-word-limit v-model="editEndpoint.name" size="small" id="module-box-input-name"></el-input>
         </el-form-item>
         <!--project-->
@@ -244,11 +244,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns right-box__footer">
-      <button v-cancel="{obj:editEndpoint,func:esc}" id="module-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editEndpoint,func:esc}" id="module-box-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" v-has="'monitor_endpoint_edit'" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="module-box-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" v-has="'monitor_endpoint_edit'" class="footer__btn" id="module-box-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
@@ -462,7 +462,7 @@ export default {
       this.$nextTick(() => {
         this.$refs.moduleForm.validate((valid) => {
           if (valid) {
-            if (this.type === 'add') {
+            if (this.optionType === 'add') {
               this.prevent_opt.save = true
               if (this.editEndpoint.assetId) {
                 this.$emit('close', true, this.editEndpoint, false)
@@ -471,7 +471,7 @@ export default {
                 this.$emit('close', true, this.editEndpoint, true)
                 this.prevent_opt.save = false
               }
-            } else if (this.type === 'edit') {
+            } else if (this.optionType === 'edit') {
               if (this.editEndpoint.id) {
                 this.$put('monitor/endpoint', [params]).then(response => {
                   if (response.code === 200) {
diff --git a/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue b/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
index c9da7a0dc..9c3d8b114 100644
--- a/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/exprTmplBox.vue
@@ -2,7 +2,7 @@
   <div v-clickoutside="{obj:editExprTemp,func:clickOutside}" class="right-box right-box-alert-config">
     <!-- begin--标题-->
     <div class="right-box__header">
-      <div class="header__title">{{editExprTemp.id ? $t("config.exprTemp.edit") + " ID：" + editExprTemp.id :
+      <div class="header__title">{{editExprTemp.id ? $t("config.exprTemp.edit"):
       $t("config.exprTemp.create")}}
     </div>
       <div class="header__operation">
@@ -56,13 +56,13 @@
     </div>
     <!-- end--表单-->
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
+    <div class="right-box__footer">
       <button id="alert-box-esc" v-cancel="{obj:editExprTemp,func:esc}"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+              class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
       <button id="alert-box-save" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" @click="save">
+              class="footer__btn footer__btn--light" @click="save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/menuBox.vue b/nezha-fronted/src/components/common/rightBox/menuBox.vue
index 1b3f94528..943533523 100644
--- a/nezha-fronted/src/components/common/rightBox/menuBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/menuBox.vue
@@ -12,7 +12,7 @@
     <!-- end--顶部按钮-->
 
     <!-- begin--标题-->
-    <div class="right-box-title">{{editMenu.id ? ($t("config.menus.editMenu") + "  ID：" + editMenu.id) : $t("config.menus.createMenu")}}</div>
+    <div class="right-box-title">{{editMenu.id ? ($t("config.menus.editMenu")) : $t("config.menus.createMenu")}}</div>
     <!-- end--标题-->
 
     <!-- begin--表单-->
@@ -68,12 +68,12 @@
     </div>
     <!-- end--表单-->
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editMenu,func:esc}" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new"
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editMenu,func:esc}" class="footer__btn footer__btn--light"
               id="menus-esc">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
+      <button @click="save" class="footer__btn"
               id="menus-save">
         <span>{{$t('overall.save')}}</span>
       </button>
diff --git a/nezha-fronted/src/components/common/rightBox/mibBox.vue b/nezha-fronted/src/components/common/rightBox/mibBox.vue
index c7abb2ce4..b2c16de3e 100644
--- a/nezha-fronted/src/components/common/rightBox/mibBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/mibBox.vue
@@ -2,7 +2,7 @@
   <div class="right-box right-box-mib" v-clickoutside="{obj:editMib,func:clickOutside}" >
     <!-- begin--标题-->
    <div class="right-box__header">
-      <div class="header__title">{{editMib.id ? ($t("config.mib.editMib") + "  ID：" + editMib.id) : $t("config.mib.createMib")}}</div>
+      <div class="header__title">{{editMib.id ? ($t("config.mib.editMib")) : $t("config.mib.createMib")}}</div>
       <div class="header__operation">
         <span v-cancel="{obj: editMib, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
       </div>
@@ -23,7 +23,7 @@
               collapse-tags
               :placeholder="$t('config.mib.modelTip')"
               size="small"
-              class="right-box__select" 
+              class="right-box__select"
               popper-class="right-box-select-dropdown prevent-clickoutside"
               clearable></el-cascader>
           </el-form-item>
@@ -45,11 +45,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editMib,func:esc}" id="model-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editMib,func:esc}" id="model-box-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="model-box-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="model-box-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/modelBox.vue b/nezha-fronted/src/components/common/rightBox/modelBox.vue
index 45e5a19bc..1f2154303 100644
--- a/nezha-fronted/src/components/common/rightBox/modelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/modelBox.vue
@@ -10,7 +10,7 @@
     <!-- end--顶部按钮-->
 
     <!-- begin--标题-->
-    <div class="right-box-title">{{editModel.id ? ($t("config.model.editModel") + "  ID：" + editModel.id) : $t("config.model.createModel")}}</div>
+    <div class="right-box-title">{{editModel.id ? ($t("config.model.editModel")) : $t("config.model.createModel")}}</div>
     <!-- end--标题-->
 
     <!-- begin--表单-->
@@ -74,11 +74,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
-      <button v-cancel="{obj:editModel,func:esc}" id="model-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editModel,func:esc}" id="model-box-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="model-box-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="model-box-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
index d1b679a89..2254eb0a6 100644
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -17,7 +17,7 @@
           <el-input placeholder="" maxlength="64" show-word-limit v-model="editModule.name" size="small" id="module-box-input-name"></el-input>
         </el-form-item>
         <!--project-->
-        <el-form-item :label='$t("project.project.project")' prop="projectId">
+        <el-form-item :label='$t("project.project.projectName")' prop="projectId">
           <el-select value-key="id" popper-class="config-dropdown" v-model="editModule.projectId" placeholder="" size="small" id="module-box-input-project" :disabled="!!editModule.id">
             <el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
           </el-select>
@@ -237,11 +237,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns right-box__footer">
-      <button v-cancel="{obj:editModule,func:esc}" id="module-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editModule,func:esc}" id="module-box-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" v-has="'monitor_module_add'" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="module-box-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" v-has="'monitor_module_add'" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="module-box-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/panelBox.vue b/nezha-fronted/src/components/common/rightBox/panelBox.vue
index 54c346353..330686181 100644
--- a/nezha-fronted/src/components/common/rightBox/panelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/panelBox.vue
@@ -1,21 +1,12 @@
 <template>
   <transition name="right-box-580">
     <div class="right-box right-box-panel z-top" v-if="rightBox.show" v-clickoutside="{obj:panel,func:clickos}">
-      <!-- begin--顶部按钮-->
-      <div class="right-box-top-btns right-box-form-delete">
-        <button @click="del(panel)" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-min-width-82" type="button" v-has="'panel_delete'" v-if="panel.id != ''">
-          <span class="right-box-top-btn-icon"><i class="nz-icon nz-icon-delete"></i></span>
-          <span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>
-        </button>
-      </div>
-      <!-- end--顶部按钮-->
-
       <!-- begin--标题-->
-      <div class="right-box-title">{{rightBox.title}}</div>
+      <div class="right-box-title right-box__header">{{rightBox.title}}</div>
       <!-- end--标题-->
 
       <!-- begin--表单-->
-      <div class="right-box-form-box">
+      <div class="right-box-form-box right-box__container">
         <el-form class="right-box-form right-box-form-left" label-width="120px"  :model="panel" label-position = "top" ref="panelForm">
           <el-form-item :label='$t("overall.name")' prop="name" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}">
             <el-input placeholder="" maxlength="64" show-word-limit v-model="panel.name" size="small" id="panel-box-input-name"></el-input>
@@ -25,11 +16,11 @@
       <!-- end--表单-->
 
       <!-- begin--底部按钮-->
-      <div class="right-box-bottom-btns">
-        <button v-cancel="{obj:panel,func:esc}" id="panel-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+      <div class="right-box__footer">
+        <button v-cancel="{obj:panel,func:esc}" id="panel-box-esc" class="footer__btn footer__btn--light">
           <span>{{$t('overall.cancel')}}</span>
         </button>
-        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="panel-box-save">
+        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="panel-box-save">
           <span>{{$t('overall.save')}}</span>
         </button>
       </div>
diff --git a/nezha-fronted/src/components/common/rightBox/projectBox.vue b/nezha-fronted/src/components/common/rightBox/projectBox.vue
index db1fd9839..58978cc28 100644
--- a/nezha-fronted/src/components/common/rightBox/projectBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/projectBox.vue
@@ -2,7 +2,7 @@
   <div class="right-box right-box-project" v-clickoutside="{obj:editProject,func:clickOutside}">
     <div class="right-box__header">
       <!-- begin--标题-->
-      <div class="right-box-title">{{editProject.id ? $t("project.project.editProject") + "  ID：" + editProject.id : $t("overall.createProject")}}</div>
+      <div class="right-box-title">{{editProject.id ? $t("project.project.editProject") : $t("overall.createProject")}}</div>
       <!-- end--标题-->
 
       <div class="header__operation">
@@ -22,11 +22,11 @@
     </div>
 
     <!--底部按钮-->
-    <div class="right-box-bottom-btns right-box__footer">
-      <button v-cancel="{obj:editProject,func:esc}" id="project-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+    <div class="right-box__footer">
+      <button v-cancel="{obj:editProject,func:esc}" id="project-esc" class="footer__btn footer__btn--light">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" v-has="'project_add'" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="project-save">
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" v-has="'project_add'" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="project-save">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/roleBox.vue b/nezha-fronted/src/components/common/rightBox/roleBox.vue
index 596b06d16..60ac47f12 100644
--- a/nezha-fronted/src/components/common/rightBox/roleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/roleBox.vue
@@ -12,7 +12,7 @@
     <!-- end--顶部按钮-->
 
     <!-- begin--标题-->
-    <div class="right-box-title">{{editRole.id ? ($t("config.roles.editRole") + "  ID：" + editRole.id) : $t("config.roles.createRole")}}</div>
+    <div class="right-box-title">{{editRole.id ? ($t("config.roles.editRole")) : $t("config.roles.createRole")}}</div>
     <!-- end--标题-->
 
     <!-- begin--表单-->
@@ -46,12 +46,12 @@
     </div>
     <!-- end--表单-->
     <!--底部按钮-->
-    <div class="right-box-bottom-btns" v-if="!detail">
-      <button v-cancel="{obj:editRole,func:esc}" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new"
+    <div class="right-box__footer" v-if="!detail">
+      <button v-cancel="{obj:editRole,func:esc}" class="footer__btn footer__btn--light"
               id="roles-esc">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
+      <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn"
               id="roles-save">
         <span>{{$t('overall.save')}}</span>
       </button>
diff --git a/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue b/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue
index bede4088d..99387974a 100644
--- a/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/snmpCredentialBox.vue
@@ -2,7 +2,7 @@
   <div class="right-box right-box-credential" v-clickoutside="{obj:editCredential,func:clickOutside}">
       <!-- begin--标题-->
       <div class="right-box__header">
-        <div class="header__title">{{editCredential.id ? ($t("config.mib.credential.edit") + "  ID：" + editCredential.id) : $t("config.mib.credential.create")}}</div>
+        <div class="header__title">{{editCredential.id ? ($t("config.mib.credential.edit")) : $t("config.mib.credential.create")}}</div>
         <div class="header__operation">
           <span v-cancel="{obj: editCredential, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
         </div>
@@ -71,11 +71,11 @@
         </div>
       </div>
       <!--底部按钮-->
-      <div class="right-box-bottom-btns">
-        <button v-cancel="{obj:editCredential,func:esc}" id="credential-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+      <div class="right-box__footer">
+        <button v-cancel="{obj:editCredential,func:esc}" id="credential-box-esc" class="footer__btn footer__btn--light">
           <span>{{$t('overall.cancel')}}</span>
         </button>
-        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="credential-box-save">
+        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="footer__btn" id="credential-box-save">
           <span>{{$t('overall.save')}}</span>
         </button>
       </div>
diff --git a/nezha-fronted/src/components/common/rightBox/userBox.vue b/nezha-fronted/src/components/common/rightBox/userBox.vue
index 70b69d544..0c9923b0b 100644
--- a/nezha-fronted/src/components/common/rightBox/userBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/userBox.vue
@@ -12,7 +12,7 @@
     <!-- end--顶部按钮-->
 
     <!-- begin--标题-->
-    <div class="right-box-title">{{editUser.id ? ($t("config.account.editAccount") + "  ID：" + editUser.id) : $t("config.account.createAccount")}}</div>
+    <div class="right-box-title">{{editUser.id ? ($t("config.account.editAccount")) : $t("config.account.createAccount")}}</div>
     <!-- end--标题-->
 
     <!-- begin--表单-->
@@ -75,14 +75,14 @@
     </div>
     <!-- end--表单-->
     <!--底部按钮-->
-    <div class="right-box-bottom-btns">
+    <div class="right-box__footer">
       <button id="account-esc" v-cancel="{obj:editUser,func:esc}"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+              class="footer__btn">
         <span>{{$t('overall.cancel')}}</span>
       </button>
       <button id="account-save" :class="{'nz-btn-disabled':prevent_opt.save}"
               :disabled="prevent_opt.save"
-              class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" @click="save"
+              class="footer__btn" @click="save"
       >
         <span>{{$t('overall.save')}}</span>
       </button>