diff --git a/nezha-fronted/src/components/common/exportXLSX.vue b/nezha-fronted/src/components/common/exportXLSX.vue
index 214fc2d31..f9feaff5d 100644
--- a/nezha-fronted/src/components/common/exportXLSX.vue
+++ b/nezha-fronted/src/components/common/exportXLSX.vue
@@ -152,7 +152,7 @@ export default {
       if (this.importUrl.indexOf('asset') > -1) {
         url = '/asset/cancelImport'
       } else if (this.importUrl.indexOf('endpoint') > -1) {
-        url = '/endpoint/cancelImport'
+        url = '/monitor/endpoint/cancelImport'
       } else if (this.importUrl.indexOf('rule') > -1) {
         url = '/alert/rule/cancelImport'
       } else if (this.importUrl.indexOf('panel') > -1) {
@@ -225,7 +225,7 @@ export default {
       } else if (this.importUrl.indexOf('panel') > -1) {
         url = '/panel/template'
       } else if (this.importUrl.indexOf('endpoint') > -1) {
-        url = '/endpoint/template'
+        url = '/monitor/endpoint/template'
       } else if (this.importUrl.indexOf('tmpl') > -1) {
         url = '/expression/tmpl/template'
       }
diff --git a/nezha-fronted/src/components/common/project/topologyL5.vue b/nezha-fronted/src/components/common/project/topologyL5.vue
index 6a3fe3843..d680b5c1a 100644
--- a/nezha-fronted/src/components/common/project/topologyL5.vue
+++ b/nezha-fronted/src/components/common/project/topologyL5.vue
@@ -3,13 +3,13 @@
   @import "./L5/css/props.css";
 </style>
 <template>
-  <div class="project-box list-page" v-loading="topologyLoading">
+  <div class="project-box list-page" v-loading="topologyLoading" v-has="'topo_list'">
     <!--project主要信息-->
     <div class="project-title" v-if="showTopTools&&!fromOverView" :style="{'background':editTopologyFlag?'#F6F6F6':'#ffffff','border-bottom':editTopologyFlag? '1px solid #F6F6F6':'' }">
       <div v-show="editTopologyFlag" class="edit-topologyLine" style="padding-left: 20px;width: calc(100% - 20px);position: absolute;top: 9px;padding-right: 20px">
         <!--工具栏-->
         <span class="project-topology-tool">
-          <el-dropdown trigger="click" size="small" placement="bottom-start">
+          <el-dropdown trigger="click" size="small" placement="bottom-start" v-has="'topo_icon_list'">
             <span class="el-dropdown-title"><i class="iconfont icon-cube"></i> <i
               class="nz-icon nz-icon-arrow-down"></i></span>
             <el-dropdown-menu slot="dropdown" @click="dropdownClick">
@@ -37,7 +37,7 @@
                   </el-collapse-item>
                 </el-collapse>
               </el-card>
-                <div class="upload-pic-box" @click="uploadPicChange">
+                <div class="upload-pic-box" @click="uploadPicChange" v-has="'topo_icon_save'">
                   <i class="el-icon-plus"></i>
                   <span>
                      Upload custom picture
@@ -119,7 +119,7 @@
                   <i class="nz-icon" :class="topoScreen?'nz-icon-exit-full-screen':'nz-icon-full-screen'"></i>
         </button>
         <button @click="editTopology" class="top-tool-btn float-right"
-                style="border-right: 1px solid rgba(162,162,162,0.50);margin-right: 12px;" type="button"
+                style="border-right: 1px solid rgba(162,162,162,0.50);margin-right: 12px;" type="button" v-has="'project_topo_update'"
         >
                   <i class="nz-icon nz-icon-edit" :title="$t('project.topology.edit')"></i>
         </button>
diff --git a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
index c1496e2b2..f0f10cc1c 100644
--- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
@@ -1,3 +1,6 @@
+<style scoped lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
 <template>
   <div class="right-box right-box-add-endpoint" :class="{'right-box-add-endpoint-snmp': currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'snmp'}" v-clickoutside="{obj:endpoint,func:clickOutside}">
     <!-- begin--顶部按钮-->
diff --git a/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue b/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
index 144c55e6a..3f2466a06 100644
--- a/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
+++ b/nezha-fronted/src/components/common/rightBox/batchModifyEndpoint.vue
@@ -1,3 +1,6 @@
+<style scoped lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
 <template>
   <div class="right-box right-box-add-endpoint" v-clickoutside="{obj:endpoint,func:clickOutside}">
     <!-- begin--顶部按钮-->
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
index 21b7048bd..7e8e927c3 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -1,11 +1,14 @@
+<style scoped lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
 <template>
   <div class="right-box right-box-module" v-clickoutside="{obj:editEndpoint,func:clickOutside}">
     <!-- begin--顶部按钮-->
-    <div class="right-box-top-btns right-box-form-delete">
-<!--      <button v-if="editEndpoint.id" id="module-del" v-has="'module_delete'" class="nz-btn nz-btn-size-normal nz-btn-size-alien" type="button" @click="del">-->
-<!--        <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 class="right-box-top-btns right-box-form-delete" v-if="optionType === 'edit'">
+      <button v-if="editEndpoint.id" id="module-del" v-has="'monitor_endpoint_delete'" class="nz-btn nz-btn-size-normal nz-btn-size-alien" type="button" @click="del">
+        <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--顶部按钮-->
 
@@ -252,7 +255,7 @@
       <button v-cancel="{obj:editEndpoint,func:esc}" id="module-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
         <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="module-box-save">
+      <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">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
@@ -859,7 +862,9 @@ export default {
     padding: 0;
   }
   /deep/ .ti-tag{
-    background-color: #FA901C;
+    background-color: #f4f4f5;
+    border-color: #e9e9eb;
+    color: #909399;
   }
 </style>
 <style>
diff --git a/nezha-fronted/src/components/common/rightBox/menuBox.vue b/nezha-fronted/src/components/common/rightBox/menuBox.vue
index 1b3f94528..769324c67 100644
--- a/nezha-fronted/src/components/common/rightBox/menuBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/menuBox.vue
@@ -1,3 +1,6 @@
+<style scoped lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
 <template>
   <div class="right-box right-box-menu" v-clickoutside="{obj:editMenu,func:clickOutside}">
     <!-- begin--顶部按钮-->
diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
index 9cefe5bbc..3e9f7505e 100644
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -1,8 +1,11 @@
+<style scoped lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
 <template>
   <div class="right-box right-box-module" v-clickoutside="{obj:editModule,func:clickOutside}">
     <!-- begin--顶部按钮-->
     <div class="right-box-top-btns right-box-form-delete">
-      <button v-if="editModule.id" id="module-del" v-has="'module_delete'" class="nz-btn nz-btn-size-normal nz-btn-size-alien" type="button" @click="del">
+      <button v-if="editModule.id" id="module-del" v-has="'monitor_module_delete'" class="nz-btn nz-btn-size-normal nz-btn-size-alien" type="button" @click="del">
         <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>
@@ -245,7 +248,7 @@
       <button v-cancel="{obj:editModule,func:esc}" id="module-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
         <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="module-box-save">
+      <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">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
@@ -763,9 +766,9 @@ export default {
     line-height: 21px;
   }
   .half-form-item {
-    width: calc(50% - 30px);
+    width: calc(50% - 21px);
     display: inline-block;
-    padding: 0 18px 0 8px;
+    padding: 0 18px 0 0px;
   }
   .half-form-item:nth-child(even){
     padding-left: 0;
@@ -838,7 +841,9 @@ export default {
     padding: 0;
   }
   /deep/ .ti-tag{
-    background-color: #FA901C;
+    background-color: #f4f4f5;
+    border-color: #e9e9eb;
+    color: #909399;
   }
 </style>
 <style>
diff --git a/nezha-fronted/src/components/common/rightBox/projectBox.vue b/nezha-fronted/src/components/common/rightBox/projectBox.vue
index 455e1d584..156210e4d 100644
--- a/nezha-fronted/src/components/common/rightBox/projectBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/projectBox.vue
@@ -1,3 +1,6 @@
+<style scoped lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
 <template>
   <div class="right-box right-box-project" v-clickoutside="{obj:editProject,func:clickOutside}">
     <!-- begin--顶部按钮-->
@@ -28,7 +31,7 @@
       <button v-cancel="{obj:editProject,func:esc}" id="project-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
         <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="project-save">
+      <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">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/table/settings/moduleTable.vue b/nezha-fronted/src/components/common/table/settings/moduleTable.vue
index 69a89a406..c8c296478 100644
--- a/nezha-fronted/src/components/common/table/settings/moduleTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/moduleTable.vue
@@ -69,7 +69,7 @@
             <span>…</span><i class="nz-icon nz-icon-arrow-down"></i>
           </div>
           <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
+            <el-dropdown-item :command="['edit', scope.row]" v-has="'monitor_module_edit'"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
             <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
diff --git a/nezha-fronted/src/components/common/table/settings/projectTable.vue b/nezha-fronted/src/components/common/table/settings/projectTable.vue
index c9b6b2a89..9e346e4c8 100644
--- a/nezha-fronted/src/components/common/table/settings/projectTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/projectTable.vue
@@ -71,8 +71,8 @@
             <span>…</span><i class="nz-icon nz-icon-arrow-down"></i>
           </div>
           <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item :command="['edit', scope.row]"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
-            <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" :disabled="scope.row.id === 1"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+            <el-dropdown-item :command="['edit', scope.row]" v-has="'project_edit'"><i class="nz-icon nz-icon-edit"></i><span class="operation-dropdown-text">{{$t('overall.edit')}}</span></el-dropdown-item>
+            <el-dropdown-item :command="['delete', scope.row, `sys/user?ids=${scope.row.id}`]" :disabled="scope.row.id === 1" v-has="'project_delete'"><i class="nz-icon nz-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
diff --git a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
index 7c4f496ca..de3b905d8 100644
--- a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
+++ b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="endpoint-list">
+  <div class="endpoint-list" v-has="'endpoint_list'">
     <nz-data-list
       ref="dataList"
       :api="url"
@@ -18,7 +18,7 @@
           import-url="monitor/endpoint/import"
           export-file-name="expression-template"
           :params="searchLabel"
-          :permissions="{import: 'asset_add', export: 'asset_add'}"
+          :permissions="{import: 'endpoint.import', export: 'endpoint.export'}"
           @afterImport="getTableData"
           class="top-tool-export margin-r-10"
         >
@@ -157,14 +157,10 @@ export default {
           index: 0
         },
         state: {
-          label: 'state',
+          label: 'State',
           key: 'states',
           type: 'checkBox',
-          children: [
-            { key: 'Down', value: 0, name: 'Down' },
-            { key: 'Up', value: 1, name: 'Up' },
-            { key: 'Suspended', value: 0, name: 'Suspended' }
-          ],
+          children: [],
           show: true,
           showMore: false,
           width: 0,
@@ -174,7 +170,7 @@ export default {
       selectValue: {
         projectIds: [],
         moduleIds: [],
-        state: []
+        states: []
       }
     }
   },
@@ -281,6 +277,11 @@ export default {
           })
         }
       })
+      this.titleSearchList.state.children = [
+        { key: 'Down', value: 0, name: 'Down' },
+        { key: 'Up', value: 1, name: 'Up' },
+        { key: 'Suspended', value: 2, name: 'Suspended' }
+      ]
     },
     batchModify () {
       if (!this.batchDeleteObjs.length) {
diff --git a/nezha-fronted/src/components/page/monitor/project/index.vue b/nezha-fronted/src/components/page/monitor/project/index.vue
index 7a1c8c571..2857cb52d 100644
--- a/nezha-fronted/src/components/page/monitor/project/index.vue
+++ b/nezha-fronted/src/components/page/monitor/project/index.vue
@@ -35,12 +35,13 @@ export default {
   height: 100%;
   width: 100%;
   display: flex;
-  background: #fff;
+  background: #f6f6f6;
   .projectList{
     flex: 1;
   }
   .projectTopo{
     flex: 1;
+    margin-right: 10px;
   }
   .hide{
     display: none;
diff --git a/nezha-fronted/src/components/page/monitor/project/project.vue b/nezha-fronted/src/components/page/monitor/project/project.vue
index 3220f7d32..489840e78 100644
--- a/nezha-fronted/src/components/page/monitor/project/project.vue
+++ b/nezha-fronted/src/components/page/monitor/project/project.vue
@@ -26,7 +26,7 @@
 <template>
   <div class="project">
     <template>
-      <topologyL5 :obj="currentProject" targetTab.sync="panel" ref="facade" :topologyIndexF="topologyIndexF" v-if="reloadFacade" @changeTopologyIndexF="changeTopologyIndexF"/>
+      <topologyL5 :obj="currentProject" targetTab.sync="panel" ref="facade" :topologyIndexF="topologyIndexF" v-if="reloadFacade" @changeTopologyIndexF="changeTopologyIndexF" v-has="'topo_list'"/>
     </template>
 
     <transition name="el-zoom-in-bottom">
diff --git a/nezha-fronted/src/router/index.js b/nezha-fronted/src/router/index.js
index fc0b4195a..6a839c0a9 100644
--- a/nezha-fronted/src/router/index.js
+++ b/nezha-fronted/src/router/index.js
@@ -103,7 +103,7 @@ export default new Router({
           component: resolve => require(['../components/page/config/snmp.vue'], resolve)
         },
         {
-          path: '/snmp',
+          path: '/snmp/:tab',
           component: resolve => require(['../components/page/config/snmp.vue'], resolve)
         },
         {