diff --git a/nezha-fronted/src/assets/stylus/main.scss b/nezha-fronted/src/assets/stylus/main.scss
index 6d8c4e2b1..6c8d5873e 100644
--- a/nezha-fronted/src/assets/stylus/main.scss
+++ b/nezha-fronted/src/assets/stylus/main.scss
@@ -1067,7 +1067,7 @@ li{
   z-index: 410;
   box-shadow: 0 0 15px #ccc;
   background-color: white;
-  padding: 0 0 0 30px;
+  padding: 0 0 0 15px;
   height: calc(100% - 50px);
 }
 
@@ -1168,7 +1168,7 @@ li{
   height: 36px;
   text-align: left;
   display: inline-block;
-  padding-top: 20px;
+  padding-top: 10px;
   font-size: 14px;
   font-weight: bold;
   color: $box-title-color;
@@ -1303,6 +1303,7 @@ li{
   height: calc(100% - 132px);
   width: 100%;
   overflow: auto;
+  margin-top: 15px;
 }
 
 .el-scrollbar__wrap {
@@ -1382,11 +1383,11 @@ li{
 }
 .right-box-form>.el-form-item.half-form-item{
   display: inline-block;
-  width: 350px;
+  width: 395px;
 }
 .right-box-form>.el-form-item.half-form-item:nth-child(odd){
   display: inline-block;
-  width: 350px;
+  width: 395px;
   margin-left: 0;
 }
 .right-box-form .one-third-form-item-left{
@@ -1406,14 +1407,14 @@ li{
 }
 .right-box-form>.el-form-item {
   margin-bottom: 18px;
-  width: calc(100% - 70px);
-  margin-left: 70px;
+  width: calc(100% - 15px);
+  margin-left: 15px;
 }
 .right-box-form .el-select {
   width: 100%;
 }
 .right-box-form .select-warp .el-select {
-  width: calc(100% - 120px);
+  width: calc(100% - 0px);
 }
 .right-box-form .el-form-item .el-form-item__label {
   padding: 0;
@@ -1434,6 +1435,27 @@ li{
   font-size: 14px;
   color: $box-label-color;
   line-height: 34px;
+  font-weight: bold;
+}
+.right-box-form-left.right-box-form /deep/ .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label:before{
+  display: none;
+}
+.right-box-form-left.right-box-form /deep/ .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label:after{
+  content: "*";
+  color: #f56c6c;
+  margin-left: 4px;
+}
+
+.right-box-form-left.right-box-form /deep/ .el-form-item.required-marker:not(.is-no-asterisk) .el-form-item__label:before{
+  display: none;
+}
+.right-box-form-left.right-box-form /deep/ .el-form-item.required-marker:not(.is-no-asterisk) .el-form-item__label:after{
+  content: "*";
+  color: #f56c6c;
+  margin-left: 4px;
+}
+.right-box-form-left.right-box-form .el-form-item.label-warp .el-form-item__label {//el-form label需要换行的行高
+  line-height: 17px;
 }
 .right-child-box-title, .asset-sub-title, .label-center, .metric-title-label {
   font-size: 14px;
@@ -2153,26 +2175,37 @@ li{
       font-size: 13px;
       color: #0275b8;
     }
-    >div:not(:last-of-type) {
-      width: calc(50% - 25px);
+    .tag-edit-tag{
+      width: 100px;
       padding: 0 10px;
     }
-    >div:last-of-type {
+    .tag-edit-value{
+      width: calc(100% - 149px);
+      padding: 0 10px;
+    }
+    .tag-edit-action {
       width: 50px;
     }
   }
   .tag-edit-box-body {
     display: flex;
     box-sizing: border-box;
+    /deep/ .el-autocomplete{
+      width: 100%;
+    }
     .tag-edit {
       padding: 0 10px;
     }
-    >div:not(:last-of-type) {
-      width: calc(50% - 25px);
+    .tag-edit-tag{
+      width: 100px;
       padding: 0 10px;
     }
-    >div:last-of-type {
-      width: 50px;
+    .tag-edit-value{
+      width: calc(100% - 149px);
+      padding: 0 10px;
+    }
+    .tag-edit-action {
+      width: 34px;
     }
   }
 }
@@ -2263,11 +2296,11 @@ li{
 }
 .right-box-form>.el-form-item.half-form-item-other{
   display: inline-block;
-  width: 350px;
+  width: 345px;
 }
 .right-box-form>.el-form-item.half-form-item-other-two{
   display: inline-block;
-  width: 380px;
+  width: 455px;
   margin-left: 0;
 }
 .right-box .right-box-form-add,.right-box  .right-box-form-minus-box{
diff --git a/nezha-fronted/src/components/common/language/cn.js b/nezha-fronted/src/components/common/language/cn.js
index 42db7ef46..8fbe98015 100644
--- a/nezha-fronted/src/components/common/language/cn.js
+++ b/nezha-fronted/src/components/common/language/cn.js
@@ -599,6 +599,7 @@ const cn = {
       menu:"菜单",
       createRole:"新增角色",
       editRole:"编辑角色",
+      remark:'描述'
     },
     menus:{
       menus:'菜单',
diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js
index a46f40af1..542b6d587 100644
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -601,7 +601,8 @@ const en = {
       permission:"Permission",
       menu:"Menu",
       createRole:"Create role",
-      editRole:"Edit role"
+      editRole:"Edit role",
+      remark:'Remark',
     },
     menus:{
       menus:'Menus',
diff --git a/nezha-fronted/src/components/common/project/L5/CanvasProps.vue b/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
index 20a7fe383..8f2b955fc 100644
--- a/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
+++ b/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
@@ -148,9 +148,9 @@
               <el-row class="thresholds-title">
                 <el-col class="thresholds-cell" :span="4">{{$t('project.topology.level')}}</el-col>
                 <el-col class="thresholds-cell" :span="4">{{$t('project.topology.color')}}</el-col>
-                <el-col class="thresholds-cell" :span="4">{{$t('project.topology.value')}}</el-col>
+                <el-col class="thresholds-cell" :span="6">{{$t('project.topology.value')}}</el-col>
                 <el-col class="thresholds-cell" :span="8">{{$t('project.topology.animation')}}</el-col>
-                <el-col class="thresholds-cell" :span="4"></el-col>
+                <el-col class="thresholds-cell" :span="2"></el-col>
               </el-row>
 
               <el-row v-for="(item,index) in selection.pen.data.valueMapping" :key="index">
@@ -189,8 +189,8 @@
                   </span>
                   <span v-else>base</span>
                 </el-col>
-                <el-col class="thresholds-cell" :span="4" style="display: flex">
-                  <span v-if="item.level!==0"> > </span>
+                <el-col class="thresholds-cell" :span="6" style="display: flex">
+                  <span v-if="item.level!==0" style="display: inline-block;width: 30%;text-align: center"> > </span>
                   <el-input-number
                     v-if="item.level!==0"
                     v-model="item.value"
@@ -228,7 +228,7 @@
                   <!--默认-->
                   <span v-if="item.level===0">base</span>
                 </el-col>
-                <el-col class="thresholds-cell" :span="4" style="text-align: center">
+                <el-col class="thresholds-cell" :span="2" style="text-align: center">
                   <i v-if="item.level!==0" @click="valueMappingDel(index, item)"
                      class="nz-icon nz-icon-minus">
                   </i>
diff --git a/nezha-fronted/src/components/common/rightBox/accountBox.vue b/nezha-fronted/src/components/common/rightBox/accountBox.vue
index 83ffaa560..9720ef1a2 100644
--- a/nezha-fronted/src/components/common/rightBox/accountBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/accountBox.vue
@@ -17,7 +17,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form :model="editUser" :rules="editUser.userId ? rules2 : rules" class="right-box-form right-box-form-left" label-position="right" label-width="120px" ref="accountForm">
+      <el-form :model="editUser" :rules="editUser.userId ? rules2 : rules" class="right-box-form right-box-form-left" label-position = "top" label-width="120px" ref="accountForm">
         <!--username-->
         <el-form-item :label="$t('config.account.account')" prop="username">
           <el-input autocomplete="new-password" type="text" placeholder="" id="account-input-username"
@@ -29,7 +29,7 @@
                     maxlength="16" show-word-limit size="small" @blur="passwordBlur"></el-input>
         </el-form-item>
         <!--passwordChange-->
-        <el-form-item :label="$t('config.account.confirmPwd')" class="passwordChange" label-width="160px" prop="passwordChange">
+        <el-form-item :label="$t('config.account.confirmPwd')" label-width="200px" prop="passwordChange">
           <el-input autocomplete="new-password" type="password" placeholder="" v-model="editUser.passwordChange" id="account-input-passwordChange"
                     maxlength="16" show-word-limit size="small"></el-input>
         </el-form-item>
@@ -339,8 +339,4 @@
     position: absolute;
     left: -120px;
   }
-  .passwordChange{
-    margin-left: 30px !important;
-    width: calc(100% - 30px) !important;
-  }
 </style>
diff --git a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
index 937a1b2dd..04bc63563 100644
--- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
@@ -10,7 +10,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box" style="overflow: hidden">
-      <el-form class="right-box-form right-box-form-left" label-position="right" ref="addEndpoint" :model="endpoint" :rules="rules">
+      <el-form class="right-box-form right-box-form-left" label-position = "top" ref="addEndpoint" :model="endpoint" :rules="rules">
         <!--project-->
         <el-form-item :label='$t("project.project.project")' prop="projectId" class="select-warp">
           <el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project">
@@ -1105,11 +1105,11 @@
     float: left;
     border: 1px solid #DCDFE6;
     border-radius: 4px;
-    width: 260px;
+    width: 320px;
   }
   .endpoints-box {
-    margin: 0 0 0 280px;
-    width: 540px;
+    margin: 0 0 0 340px;
+    width: 445px;
   }
   .endpoints-box.endpoints-box-snmp {
     width: 380px;
@@ -1260,7 +1260,7 @@
   }
   .line-100 {
     margin-bottom: 3px;
-    width: 600px;
+    width: 320px;
   }
   .endpoint-sub-table-head {
     line-height: 28px;
diff --git a/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue b/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
index f07dbf32d..dfb8297bf 100644
--- a/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
@@ -15,12 +15,12 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form right-box-form-left" :model="editAlertRule" label-position="right" label-width="120px" :rules="rules" ref="alertRuleForm">
+      <el-form class="right-box-form right-box-form-left" :model="editAlertRule" label-position = "top" label-width="120px" :rules="rules" ref="alertRuleForm">
         <!--alertName-->
         <el-form-item :label='$t("alert.config.name")' prop="alertName">
           <el-input placeholder="" maxlength="64" show-word-limit v-model="editAlertRule.alertName" size="small" id="alert-box-input-name"></el-input>
         </el-form-item>
-        <div style="width: calc(100% - 70px);margin-left: 70px">
+        <div style="width: calc(100% - 15px);margin-left: 15px">
           <promql-input
             ref="promql"
             :expression-list.sync="expressions"
@@ -31,13 +31,13 @@
           ></promql-input>
         </div>
         <!--operator-->
-        <el-form-item :label="$t('alert.config.operator')" prop="operator" style="width: 400px;display: inline-block;">
+        <el-form-item :label="$t('alert.config.operator')" prop="operator" style="display: inline-block;">
           <el-select popper-class="config-dropdown" v-model="editAlertRule.operator" placeholder=""  size="small" id="alert-box-input-operator">
             <el-option :id="'operator-'+item.key" v-for="item in operators" :key="item.value" :label="item.label" :value="item.value"></el-option>
           </el-select>
         </el-form-item>
         <!--threshold-->
-        <el-form-item :label="$t('alert.config.threshold')" prop="threshold" style="width: 415px;display: inline-block;">
+        <el-form-item :label="$t('alert.config.threshold')" prop="threshold" style="display: inline-block;">
           <el-input type="text" placeholder="" v-model="editAlertRule.threshold" size="small" id="alert-box-input-threshold">
           </el-input>
         </el-form-item>
@@ -305,13 +305,13 @@
     justify-content: left;
     justify-items: center;
     align-items: center;
-    width: calc(100% - 220px);
+    width: calc(100% - 46px);
     padding: 10px 15px;
     background: #F6F6F6;
     color: #999999;
     margin-top: -13px;
     margin-bottom: 18px;
-    margin-left: 190px;
+    margin-left: 15px;
     font-size: 14px;
   }
   .rule-severity-remark .nz-icon-info-normal{
diff --git a/nezha-fronted/src/components/common/rightBox/assetBox.vue b/nezha-fronted/src/components/common/rightBox/assetBox.vue
index 69c09075b..d43a716d6 100644
--- a/nezha-fronted/src/components/common/rightBox/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetBox.vue
@@ -12,7 +12,7 @@
     <div class="right-box-title">{{editAsset.id ? ($t("asset.editAsset") + "  ID：" + editAsset.id) : $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">
+      <el-form ref="assetEditForm" :model="editAsset" label-width="120px" class="right-box-form right-box-form-left" :rules="rules" label-position = "top">
         <el-form-item :label="$t('asset.sn')" prop="sn">
           <el-input size="small" v-model="editAsset.sn"/>
         </el-form-item>
@@ -91,15 +91,12 @@
           </button>
         </div></div>
         <div class="right-box-line"></div>
-        <el-form-item>
-          <template slot="label">
-            <span></span>
-          </template>
+        <el-form-item :label-width="'0px'">
           <div class="tag-edit-box">
             <div class="tag-edit-box-head">
-              <div>Tag</div>
-              <div>Value</div>
-              <div>Action</div>
+              <div class="tag-edit-tag">Tag</div>
+              <div class="tag-edit-value">Value</div>
+              <div class="tag-edit-action">Action</div>
             </div>
             <div style="height: calc(100% - 32px); overflow: auto" id="asset-box-tags">
               <div class="tag-edit-box-body" v-for="(item, index) in editAsset.tags">
@@ -109,7 +106,7 @@
                 <el-form-item class="tag-edit tag-edit-value" :rules="{required: true, message: $t('validate.required'), trigger: 'change'}" :prop="'tags.' + index + '.value'">
                   <el-autocomplete placeholder="value" size="mini" v-model="item.value" :fetch-suggestions="filterValue" popper-class="no-style-class"></el-autocomplete>
                 </el-form-item>
-                <div class="param-box-row-symbol" :id="'asset-tag-remove-'+index" @click.stop="removeTag(index)"><i class="nz-icon nz-icon-shanchu1" style="color: #666666"></i></div>
+                <div class="param-box-row-symbol tag-edit-action" :id="'asset-tag-remove-'+index" @click.stop="removeTag(index)"><i class="nz-icon nz-icon-shanchu1" style="color: #666666"></i></div>
               </div>
             </div>
           </div>
@@ -130,7 +127,7 @@
           </el-popover>
         </div>
         <div class="right-box-line"></div>
-        <div class="nz-tab" style="padding-left: 70px;">
+        <div class="nz-tab" style="padding-left: 15px;">
           <div class="nz-tab-item-box" v-for="(account, index) in editAsset.accounts" :key="index" @click="changeProtocolType(account.protocol)" :id="`account-login-type-${index}`">
             <div class="nz-tab-item" :class="{'nz-tab-item-active': accountType == account.protocol}" style="position: relative;">
               <span>{{account.protocol}}</span>
@@ -144,7 +141,7 @@
         <account-config-box v-for="(account,index) in editAsset.accounts" :account="account" v-show="account.protocol == accountType" :key="index" ref="accountConfigBox" @setValidateResult="setAccountValidResult" @protocol-type-change="protocolTypeChange"></account-config-box>
 
         <template v-if="accountType == 'SSH' && !editAsset.id">
-          <el-form-item :label="$t('asset.exporter')" class="exporter-label" style="margin-left: 66px">
+          <el-form-item :label="$t('asset.exporter')" class="exporter-label" style="margin-left: 15px">
             <el-switch class="exporter-switch" v-model="editAsset.exporter" active-color="#ee9d3f" active-value="1" inactive-value="0" :show="!exporterDisableSwitch" id="account-box-input-exporter"></el-switch>
           </el-form-item>
         </template>
diff --git a/nezha-fronted/src/components/common/rightBox/cabinetBox.vue b/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
index 5c7e1810d..475c010eb 100644
--- a/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
@@ -15,7 +15,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form right-box-form-left" label-width="120px" label-position="right" :model="editCabinet" ref="cabinetForm" :rules="rules">
+      <el-form class="right-box-form right-box-form-left" label-width="120px" label-position = "top" :model="editCabinet" ref="cabinetForm" :rules="rules">
         <el-form-item :label="$t('overall.name')" prop="name">
           <el-input size='mini' v-model="editCabinet.name" id="cabinet-box-input-name"/>
         </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/dcBox.vue b/nezha-fronted/src/components/common/rightBox/dcBox.vue
index 917a2ff92..a723b4f54 100644
--- a/nezha-fronted/src/components/common/rightBox/dcBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/dcBox.vue
@@ -15,7 +15,7 @@
 
       <!-- begin--表单-->
       <div class="right-box-form-box">
-        <el-form class="right-box-form right-box-form-left" label-width="120px" :model="editDc" label-position="right" :rules="rules" ref="dcForm">
+        <el-form class="right-box-form right-box-form-left" label-width="120px" :model="editDc" label-position = "top" :rules="rules" ref="dcForm">
           <el-form-item :label='$t("overall.name")' prop="name">
             <el-input placeholder="" maxlength="64" show-word-limit v-model="editDc.name" size="small" id="dc-box-input-name"></el-input>
           </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
index 0cff51cb7..832140153 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
@@ -15,7 +15,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form  right-box-form-left" :model="editEndpoint" label-position="right" label-width="120px" :rules="rules" ref="endpointForm">
+      <el-form class="right-box-form  right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="endpointForm">
         <!--project-->
         <el-form-item :label="$t('project.project.project')" prop="project.id">
           <el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project">
diff --git a/nezha-fronted/src/components/common/rightBox/menuBox.vue b/nezha-fronted/src/components/common/rightBox/menuBox.vue
index ce9cd1af3..6cb65c1e8 100644
--- a/nezha-fronted/src/components/common/rightBox/menuBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/menuBox.vue
@@ -17,7 +17,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form :model="editMenu" :rules="rules" class="right-box-form right-box-form-left" label-position="right" label-width="130px" ref="menuForm" size="small">
+      <el-form :model="editMenu" :rules="rules" class="right-box-form right-box-form-left" label-position = "top" label-width="130px" ref="menuForm" size="small">
         <el-form-item :label="$t('config.menus.parent')" prop="parentId">
           <tree-select :multiple="false" :options="menus" label="id" noChildrenText="" noOptionsText="" placeholder="" v-model="editMenu.parentId" id="menu-box-input-parent"></tree-select>
         </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/mibBox.vue b/nezha-fronted/src/components/common/rightBox/mibBox.vue
index c0da3c096..fb7bbc508 100644
--- a/nezha-fronted/src/components/common/rightBox/mibBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/mibBox.vue
@@ -15,7 +15,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form  right-box-form-left" :model="editMib" label-position="right" label-width="120px" :rules="rules" ref="mibForm">
+      <el-form class="right-box-form  right-box-form-left" :model="editMib" label-position = "top" label-width="120px" :rules="rules" ref="mibForm">
         <el-form-item :label='$t("config.mib.models")' prop="models" :rules="[{validator:checkModels,trigger:'change'}]" >
           <el-cascader
             id="mib-input-selected-models"
diff --git a/nezha-fronted/src/components/common/rightBox/modelBox.vue b/nezha-fronted/src/components/common/rightBox/modelBox.vue
index 5b177c6d6..b5314c4fb 100644
--- a/nezha-fronted/src/components/common/rightBox/modelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/modelBox.vue
@@ -15,7 +15,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form right-box-form-left" :model="editModel" label-position="right" label-width="120px"  :rules="rules" ref="modelForm">
+      <el-form class="right-box-form right-box-form-left" :model="editModel" label-position = "top" label-width="120px"  :rules="rules" ref="modelForm">
         <!--model名称-->
         <el-form-item :label='$t("overall.name")' prop="name">
           <el-input placeholder="" maxlength="64" show-word-limit v-model.trim="editModel.name" size="small" id="model-box-input-name"></el-input>
diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
index eaa96523b..a0a450cc7 100644
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -15,13 +15,13 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box" ref="scrollbar">
-      <el-form class="right-box-form right-box-form-left" :model="editModule" label-position="right" label-width="120px" :rules="rules" ref="moduleForm">
+      <el-form class="right-box-form right-box-form-left" :model="editModule" label-position = "top" label-width="120px" :rules="rules" ref="moduleForm">
         <el-form-item :label='$t("project.project.project")' prop="project">
           <el-select value-key="id" popper-class="config-dropdown" v-model="editModule.project" placeholder="" size="small" id="module-box-input-project">
             <el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item"></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item :label='$t("project.module.moduleName")' prop="name" label-width="180px" style="width: calc(100% - 8px);margin-left: 8px;">
+        <el-form-item :label='$t("project.module.moduleName")' prop="name" label-width="125px" style="width: calc(100% - 8px);margin-left: 8px;">
           <el-input placeholder="" maxlength="64" show-word-limit v-model="editModule.name" size="small" id="module-box-input-name"></el-input>
         </el-form-item>
 
@@ -43,7 +43,7 @@
             <el-col :span="6">
               <div class="sub-label sub-label-required">{{$t('project.module.walk')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="walk">
                 <select-walk ref="selectWalk" :walkData="walkData" :expandedWalk="expandedWalkData" :placement="'bottom-start'" @selectWalk="selectWalk" :currentWalk="editModule.walk">
                   <template v-slot:trigger>
@@ -72,7 +72,7 @@
             <el-col :span="6">
               <div class="sub-label">{{$t('project.module.version')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="version">
                 <el-radio-group v-model.number="editModule.version" size="small" id="module-box-input-version">
                   <el-radio-button :label="2"></el-radio-button>
@@ -86,7 +86,7 @@
             <el-col :span="6">
               <div class="sub-label">{{$t('project.module.maxRepetitions')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="max_repetitions">
                 <el-input v-model.number="editModule.max_repetitions" size="small" id="module-box-input-max_repetitions"></el-input>
               </el-form-item>
@@ -97,7 +97,7 @@
             <el-col :span="6">
               <div class="sub-label">{{$t('project.module.retries')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="retries">
                 <el-input v-model.number="editModule.retries" size="small" id="module-box-input-retries"></el-input>
               </el-form-item>
@@ -108,7 +108,7 @@
             <el-col :span="6">
               <div class="sub-label">{{$t('project.module.timeout')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="timeout">
                 <el-input v-model.number="editModule.timeout" size="small" id="module-box-input-timeout">
                   <template slot="append">second</template>
@@ -128,7 +128,7 @@
             <el-col :span="6">
               <div class="sub-label sub-label-required">{{$t('project.module.community')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="community">
                 <el-input v-model.trim="editModule.community" maxlength="64" show-word-limit size="small" id="module-box-input-community"></el-input>
               </el-form-item>
@@ -141,7 +141,7 @@
               <el-col :span="6">
                 <div class="sub-label sub-label-required">{{$t('login.username')}}</div>
               </el-col>
-              <el-col :span="18">
+              <el-col :span="24">
                 <el-form-item prop="username">
                   <el-input v-model.trim="editModule.username" maxlength="64" show-word-limit size="small" id="module-box-input-username"></el-input>
                 </el-form-item>
@@ -152,7 +152,7 @@
               <el-col :span="6">
                 <div class="sub-label">{{$t('project.module.securityLevel')}}</div>
               </el-col>
-              <el-col :span="18">
+              <el-col :span="24">
                 <el-form-item prop="security_level">
                   <el-radio-group size="small" v-model="editModule.security_level" id="module-box-input-security_level">
                     <el-radio-button label="noAuthNoPriv"></el-radio-button>
@@ -167,7 +167,7 @@
               <el-col :span="6">
                 <div class="sub-label sub-label-required">{{$t('login.password')}}</div>
               </el-col>
-              <el-col :span="18">
+              <el-col :span="24">
                 <el-form-item prop="password">
                   <el-input v-model.trim="editModule.password" type="password" show-password maxlength="64" show-word-limit size="small" id="module-box-input-password"></el-input>
                 </el-form-item>
@@ -178,7 +178,7 @@
               <el-col :span="6">
                 <div class="sub-label">{{$t('project.module.authProtocol')}}</div>
               </el-col>
-              <el-col :span="18">
+              <el-col :span="24">
                 <el-form-item prop="auth_protocol">
                   <el-radio-group v-model="editModule.auth_protocol" size="small" id="module-box-input-auth_protocol">
                     <el-radio-button label="MD5"></el-radio-button>
@@ -192,7 +192,7 @@
               <el-col :span="6">
                 <div class="sub-label">{{$t('project.module.privProtocol')}}</div>
               </el-col>
-              <el-col :span="18">
+              <el-col :span="24">
                 <el-form-item prop="priv_protocol">
                   <el-radio-group v-model="editModule.priv_protocol" size="small" id="module-box-input-priv_protocol">
                     <el-radio-button label="DES"></el-radio-button>
@@ -206,7 +206,7 @@
               <el-col :span="6">
                 <div class="sub-label sub-label-required">{{$t('project.module.privPassword')}}</div>
               </el-col>
-              <el-col :span="18">
+              <el-col :span="24">
                 <el-form-item prop="priv_password">
                   <el-input v-model.trim="editModule.priv_password" type="password" show-password maxlength="64" show-word-limit size="small" id="module-box-input-priv_password"></el-input>
                 </el-form-item>
@@ -218,7 +218,7 @@
             <el-col :span="6">
               <div class="sub-label">{{$t('project.module.contextName')}}</div>
             </el-col>
-            <el-col :span="18">
+            <el-col :span="24">
               <el-form-item prop="context_name">
                 <el-input v-model.trim="editModule.context_name" maxlength="64" show-word-limit size="small" id="module-box-input-context_name"></el-input>
               </el-form-item>
@@ -226,7 +226,7 @@
           </el-row>
         </span>
 
-        <div class="right-box-form-tip" :style="{'margin-bottom': '15px','margin-left':editModule.type.toLowerCase()=='snmp'?'100px':'0'}">
+        <div class="right-box-form-tip" :style="{'margin-bottom': '15px','margin-left':editModule.type.toLowerCase()=='snmp'?'15px':'0'}">
           {{$t('project.module.tip.defaultEndpointSet')}}
           <div></div>
           {{$t('project.module.tip.relation')}}
@@ -736,13 +736,15 @@
     padding-right: 15px;
     font-size: 14px;
     color: #666;
-    text-align: right;
-    line-height: 30px
+    text-align: left;
+    line-height: 30px;
+    padding-left: 15px;
+    font-weight: bold;
   }
-  .sub-label-required::before {
+  .sub-label-required::after {
     content: '*';
     color: #F56C6C;
-    margin-right: 4px;
+    margin-left: 4px;
   }
   .module-box-type {
     margin: 25px 0 10px -15px;
diff --git a/nezha-fronted/src/components/common/rightBox/panelBox.vue b/nezha-fronted/src/components/common/rightBox/panelBox.vue
index fa0ff0438..d49e9c5e5 100644
--- a/nezha-fronted/src/components/common/rightBox/panelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/panelBox.vue
@@ -16,7 +16,7 @@
 
       <!-- begin--表单-->
       <div class="right-box-form-box">
-        <el-form class="right-box-form right-box-form-left" label-width="120px"  :model="panel" label-position="right" ref="panelForm">
+        <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>
           </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/projectBox.vue b/nezha-fronted/src/components/common/rightBox/projectBox.vue
index ca15dbfbf..8e4d5083b 100644
--- a/nezha-fronted/src/components/common/rightBox/projectBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/projectBox.vue
@@ -13,7 +13,7 @@
     <div class="right-box-title">{{editProject.id ? $t("project.project.editProject") + "  ID：" + editProject.id : $t("overall.createProject")}}</div>
     <!-- end--标题-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form right-box-form-left" :model="editProject" label-position="right" label-width="120px" :rules="rules" ref="projectForm">
+      <el-form class="right-box-form right-box-form-left" :model="editProject" label-position = "top" label-width="120px" :rules="rules" ref="projectForm">
         <el-form-item :label='$t("project.project.projectName")' prop="name">
           <el-input size="mini" maxlength="64" show-word-limit v-model="editProject.name" id="project-box-input-name"></el-input>
         </el-form-item>
diff --git a/nezha-fronted/src/components/common/rightBox/promServerBox.vue b/nezha-fronted/src/components/common/rightBox/promServerBox.vue
index e040ef97b..61a9807d9 100644
--- a/nezha-fronted/src/components/common/rightBox/promServerBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/promServerBox.vue
@@ -17,7 +17,7 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form class="right-box-form right-box-form-left" :model="editPromServer" label-position="right" label-width="120px" :rules="rules" ref="promServerForm">
+      <el-form class="right-box-form right-box-form-left" :model="editPromServer" label-position = "top" label-width="120px" :rules="rules" ref="promServerForm">
         <!--DC-->
         <el-form-item :label="$t('config.dc.dc')" prop="idc.name">
           <div class="right-box-form-content">
diff --git a/nezha-fronted/src/components/common/rightBox/roleBox.vue b/nezha-fronted/src/components/common/rightBox/roleBox.vue
index 7468e70f2..290cdbfbf 100644
--- a/nezha-fronted/src/components/common/rightBox/roleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/roleBox.vue
@@ -17,13 +17,13 @@
 
     <!-- begin--表单-->
     <div class="right-box-form-box">
-      <el-form :disabled="detail" :model="editRole" :rules="rules" class="right-box-form right-box-form-left" label-position="right" label-width="120px" ref="roleForm">
+      <el-form :disabled="detail" :model="editRole" :rules="rules" class="right-box-form right-box-form-left" label-position = "top" label-width="120px" ref="roleForm">
         <!--name-->
         <el-form-item :label="$t('config.roles.name')" prop="name">
           <el-input  maxlength="64" placeholder="" id="role-box-input-name"
                     show-word-limit size="small" type="text" v-model="editRole.name"></el-input>
         </el-form-item>
-        <el-form-item :label="$t('config.roles.remark')">
+        <el-form-item :label="$t('config.roles.description')">
           <el-input :rows="2" size='mini' type="textarea" v-model="editRole.remark" id="role-box-input-remark"/>
         </el-form-item>
 
diff --git a/nezha-fronted/src/components/page/asset/accountConfig.vue b/nezha-fronted/src/components/page/asset/accountConfig.vue
index 29393774e..b954ab96d 100644
--- a/nezha-fronted/src/components/page/asset/accountConfig.vue
+++ b/nezha-fronted/src/components/page/asset/accountConfig.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-form label-width="120px" :model="account" :rules="rules" ref="accountForm" style="margin-top: 20px;margin-left: 66px">
+  <el-form label-width="120px"  :model="account" :rules="rules" ref="accountForm" style="margin-top: 20px;margin-left: 15px"  label-position = "top">
     <template v-if="account.protocol == 'SSH'">
       <el-form-item :label="$t('asset.account')" prop="params.username">
         <el-input autocomplete="new-password" size="small" v-model="account.params.username" id="ssh-account-username"/>
diff --git a/nezha-fronted/src/components/page/config/changePwd.vue b/nezha-fronted/src/components/page/config/changePwd.vue
index 1c287985b..623942c47 100644
--- a/nezha-fronted/src/components/page/config/changePwd.vue
+++ b/nezha-fronted/src/components/page/config/changePwd.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <el-dialog class="nz-dialog" :title="$t('overall.changePwd')" :visible.sync="visible"  @open="dialogOpened"  :modal-append-to-body='false' @closed="dialogClosed" width="600px" :show-close="false" >
-      <el-form :model="user" label-position="right" label-width="150px" :rules="rules" ref="changePwdForm" size="mini">
+      <el-form :model="user" label-position = "top" label-width="150px" :rules="rules" ref="changePwdForm" size="mini">
         <el-form-item :label="$t('config.account.account')" prop="username" v-show="curUser != sysUser">
           <el-input type="text" autocomplete="false" v-model="user.username" disabled id="change-pwd-username"></el-input>
         </el-form-item>
diff --git a/nezha-fronted/src/components/page/dashboard/alertChartParam.vue b/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
index 3982216f1..0e64afcdd 100644
--- a/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
+++ b/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
@@ -1,5 +1,5 @@
 <template>
-    <el-form :model="parameters" ref="alertChartParam" size="small" label-position="left" label-width="80px" class="alert-chart-param-form">
+    <el-form :model="parameters" ref="alertChartParam" size="small" label-position="top" label-width="200px" class="alert-chart-param-form">
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.select')" >
         <el-cascader
           id="alert-param-select"
diff --git a/nezha-fronted/src/components/page/dashboard/chartBox.vue b/nezha-fronted/src/components/page/dashboard/chartBox.vue
index 206bb15e5..f2f1d7b36 100644
--- a/nezha-fronted/src/components/page/dashboard/chartBox.vue
+++ b/nezha-fronted/src/components/page/dashboard/chartBox.vue
@@ -166,7 +166,7 @@
 
       <!-- begin--表单-->
       <div class="right-box-form-box" ref="scrollbar">
-        <el-form :model="editChart" :rules="rules" class="right-box-form  right-box-form-left" label-position="right" label-width="120px" ref="chartForm">
+        <el-form :model="editChart" :rules="rules" class="right-box-form  right-box-form-left" label-position = "top" label-width="120px" ref="chartForm">
           <el-form-item :label="$t('dashboard.panel.title')" prop="panelName" v-if="showPanel.type != 'dashboard' && showPanel.type != 'project' && showPanel.type != 'asset' && showPanel.type != 'model'">
             <!--<el-autocomplete
               :fetch-suggestions="panelSuggestion"
@@ -289,7 +289,7 @@
           <div class="right-box-sub-title" v-if="isAlert">{{$t('dashboard.panel.chartForm.alertParam.param')}}</div>
           <div style="width: 100%" v-if="!isUrl"></div>
 
-          <el-row class="element-item" style="width: calc(100% - 108px);margin-left: 108px" v-if="isAlert">
+          <el-row class="element-item" v-if="isAlert">
             <alert-chart-param @on-enter-complate="getAlertParam" ref="alertParamBox"></alert-chart-param>
           </el-row>
           <div id="chart-box-expression-box" style="margin-bottom: 20px">
@@ -400,7 +400,7 @@
         </template>
         <template v-if="(editChart.type == 'singleStat'||editChart.type == 'table')&&editChart.param.valueMapping.type == 'range'" id="chart-box-valueMapping-type2">
           <template  v-for="(mapping,index) in editChart.param.valueMapping.mapping">
-            <div class="half-form-item-other" style="display: inline-block;margin-left: 70px">
+            <div class="half-form-item-other" style="display: inline-block;margin-left: 15px">
               <el-form-item :label="$t('dashboard.panel.chartForm.valMapping.from')" prop="span" class="one-third-form-item-left" >
                 <el-input size="mini" type="input" v-model="mapping.from"></el-input>
               </el-form-item>
@@ -452,7 +452,7 @@
           </div>
           <div style="margin-bottom: 20px; width: 100%" ></div>
           <div style="display: flex;">
-            <span style="margin-left: 150px;"></span>
+            <span style="margin-left: 75px;"></span>
             <template v-for="item in sortedOptionKeys">
               <div style="flex: 1">
                 <span style="margin-right: 10px;color:rgb(102, 102, 102)">{{item.label}}</span>
diff --git a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
index 4a67e1d9e..f986c1ce3 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
@@ -22,7 +22,7 @@
           <!--right-box里的样式-->
           <template v-if="styleType == 2">
             <el-row v-if="plugins.indexOf('metric-input') > -1 || plugins.indexOf('metric-selector') > -1" style="width: 100%;">
-              <el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666">
+              <el-col :style="{'width':plugins.indexOf('metric-selector') > -1 ? '120px':'100%', 'padding-right': '20px', 'text-align':plugins.indexOf('metric-selector') > -1 ? 'right':'left', 'color': '#666','font-weight':plugins.indexOf('metric-selector') > -1 ?'400':'bold'}">
                 <el-dropdown class="metric-selector" v-if="plugins.indexOf('metric-selector') > -1">
                   <el-dropdown-menu style="display: none"></el-dropdown-menu>
                   <span :class="{'expr-title':projectRightBox}" style="cursor: pointer;" @click="toggleDropdown">Metric&nbsp;<i class="nz-icon nz-icon-arrow-down" style="font-size: 14px; -webkit-transform:scale(0.75);display:inline-block;"></i></span>
@@ -30,7 +30,7 @@
                 </el-dropdown>
                 <label style="line-height: 30px;" v-else>{{$t("alert.config.expr")}}</label>
               </el-col>
-              <el-col style="width: calc(100% - 120px); height: 100%;">
+              <el-col :style="{'width':plugins.indexOf('metric-selector') > -1 ? 'calc(100% - 120px)':'100%',height: '100%',}">
                 <div class="input-box" @click="dropDownVisible=false" v-if="plugins.indexOf('metric-input') > -1">
                   <!--<editor :styleType="styleType" :metric-list="metricStore" :historyParam="historyParam" v-model="expressionList[index]" ref="editor" @on-enter="expressionChange" @on-blur="expressionChange" ></editor>-->
                   <el-input v-model="expressionList[index]" @change="metricChange"></el-input>