Merge branch 'dev-3.3' of https://git.mesalab.cn/nezha/nezha-fronted into dev-3.4

# Conflicts: # nezha-fronted/src/components/common/table/settings/userTable.vue
2022-06-22 11:47:20 +08:00
parent f12a067685 f3589cdd2a
commit 98decd29f9
245 changed files with 2832 additions and 1444 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -17,3 +17,4 @@ nezha-fronted/src/router/mergeTable.js
 nezha-fronted/src/components/page/dashboard/testData.js
 nezha-fronted/src/components/common/rightBox/tempRoghtBox.vue
 nezha-fronted/exportHtml/
+nezha-fronted/src/a.txt
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -37,9 +37,15 @@ dev_build:
    - echo "npm install ..."
    - npm install --registry=http://registry.npmmirror.com
    - echo "npm run build"
-    - npm run build
+    
+    # 编译 上传模板
+    - npm run build:html
+    - mc alias set nz $MINIO_HOST $MINIO_USER $MINIO_PWD
+    - mc cp dist/index.html nz/depends/template/snapshot_template.html

+    - npm run build
    - cd /builds/nezha/nezha-fronted/nezha-fronted/dist 
+    - mc cp nz/depends/template/snapshot_template.html ./snapshot_template.html
    - rm -rf nz-gui*.zip
    - export FILE_NAME=nz-gui-$CI_COMMIT_REF_NAME-$CI_COMMIT_SHORT_SHA.zip
    # 生成 git log 日志文件
@@ -50,7 +56,6 @@ dev_build:
    - zip -q -r $FILE_NAME ./*

    # 将 dist zip 上传到 minio 
-    - mc alias set nz $MINIO_HOST $MINIO_USER $MINIO_PWD
    - mc cp $FILE_NAME nz/ci-cd/nz-gui/$FILE_NAME
    - mc cp $FILE_NAME nz/ci-cd/nz-gui/nz-gui-$CI_COMMIT_REF_NAME-latest.zip
  artifacts:
@@ -78,11 +83,17 @@ rel_build:
    - cd nezha-fronted
    - npm install --registry=http://registry.npmmirror.com
    - echo "npm run build"
+
+    - npm run build:html
+    - mc alias set nz $MINIO_HOST $MINIO_USER $MINIO_PWD
+    - mc cp dist/index.html nz/depends/template/snapshot_template.html
+
    - npm run build
    - cd /builds/nezha/nezha-fronted/nezha-fronted/dist
+    - mc cp nz/depends/template/snapshot_template.html ./snapshot_template.html
+    - zip -m nz-gui*.zip ./snapshot_template.html
    - mv nz-gui*.zip nz-gui-$CI_COMMIT_SHORT_SHA.zip
    - md5sum nz-gui-$CI_COMMIT_SHORT_SHA.zip > nz-gui-$CI_COMMIT_SHORT_SHA.zip.md5sum.txt
-    - mc alias set nz $MINIO_HOST $MINIO_USER $MINIO_PWD
    - mc cp nz-gui-$CI_COMMIT_SHORT_SHA.zip nz/release/nz-gui/nz-gui-$CI_COMMIT_SHORT_SHA.zip
    - mc cp nz-gui-$CI_COMMIT_SHORT_SHA.zip.md5sum.txt nz/release/nz-gui/nz-gui-$CI_COMMIT_SHORT_SHA.zip.md5sum.txt
  artifacts:
--- a/nezha-fronted/README.md
+++ b/nezha-fronted/README.md
@@ -20,19 +20,19 @@ npm run build --report

 For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).

-#启动项目
+# 启动项目

 需要配置 config.json 为 {"baseUrl":"http://192.168.40.42:8080/", "version": "21.04"}

-#自动化测试
+# 自动化测试
 npm run unit
 根目录下 /test/jest.conf.js collectCoverageFrom 变量配置需要测试报告的文件 （因为暂时不测所有 只能一个个引入）
 specs 配置对应的测试用例 （https://docs.geedge.net/pages/viewpage.action?pageId=58310079 参考匹配器）

-#思维导图
+# 思维导图
 https://docs.geedge.net/pages/viewpage.action?pageId=67209306

-#配置多入口
+# 配置多入口
 dev  正常启动
 dev:html   导出为html

--- a/nezha-fronted/build/webpack.base.conf.js
+++ b/nezha-fronted/build/webpack.base.conf.js
@@ -104,7 +104,6 @@ if (arg === 'html' || devStart === 'dev:html') {
  baseConfig.module.rules.unshift({
    include: [
      resolve('src/entrance/app'),
-      resolve('src/components/common/alert'),
      resolve('src/components/common/bottomBox'),
      resolve('src/components/common/detailView'),
      resolve('src/components/common/elSelect'),
--- a/nezha-fronted/build/webpack.dev.conf.js
+++ b/nezha-fronted/build/webpack.dev.conf.js
@@ -9,7 +9,7 @@ const CopyWebpackPlugin = require('copy-webpack-plugin')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
 const portfinder = require('portfinder')
-
+const intro = require('intro.js')
 const HOST = process.env.HOST
 const PORT = process.env.PORT && Number(process.env.PORT)
 const devStart = process.env.npm_lifecycle_event
@@ -49,6 +49,9 @@ devWebpackConfig = merge(baseWebpackConfig, {
    }
  },
  plugins: [
+    new webpack.ProvidePlugin({
+      introJs: ['intro.js']
+    }),
    new webpack.DefinePlugin({
      'process.env': require('../config/dev.env')
    }),
--- a/nezha-fronted/build/webpack.prod.conf.js
+++ b/nezha-fronted/build/webpack.prod.conf.js
@@ -49,6 +49,9 @@ if (arg === 'html') {
      chunkFilename: utils.assetsPath('js/[name].[chunkhash].js')
    },
    plugins: [
+      new webpack.ProvidePlugin({
+        introJs: ['intro.js'],
+      }),
      /* new GenerateAssetPlugin({
        filename: 'config.json',
        fn: (compilation, cb) => {
@@ -198,6 +201,9 @@ if (arg === 'html') {
        extraFiles: []
      }), */
      // http://vuejs.github.io/vue-loader/en/workflow/production.html
+      new webpack.ProvidePlugin({
+        introJs: ['intro.js']
+      }),
      new webpack.DefinePlugin({
        'process.env': env
      }),
@@ -312,7 +318,8 @@ if (process.env.NODE_ENV == 'development') {
      onEnd: [
        {
          move: [
-            { source: path.join(__dirname, '../dist', '/static/config.json'), destination: path.join(__dirname, '../dist/config.json') }
+            { source: path.join(__dirname, '../dist', '/static/config.json'), destination: path.join(__dirname, '../dist/config.json') },
+            // { source: path.join(__dirname, '../exportHtml', '/snapshot_template.html'), destination: path.join(__dirname, '../dist/snapshot_template.html') }

          ],
          mkdir: [
@@ -345,7 +352,8 @@ if (process.env.NODE_ENV == 'development') {
    onEnd: [
      {
        move: [
-          { source: path.join(__dirname, '../dist', '/static/config.json'), destination: path.join(__dirname, '../dist/config.json') }
+          { source: path.join(__dirname, '../dist', '/static/config.json'), destination: path.join(__dirname, '../dist/config.json') },
+          // { source: path.join(__dirname, '../exportHtml', '/snapshot_template.html'), destination: path.join(__dirname, '../dist/snapshot_template.html') }

        ],
        mkdir: [
@@ -368,12 +376,12 @@ if (process.env.NODE_ENV == 'development') {
      }
    ]
  }
-  if (arg === 'html') {
-    plugin.onStart[0].delete.push(path.join(__dirname, '../exportHtml/'))
-    plugin.onEnd[0].copy.push(
-      { source: path.join(__dirname, '../dist', '/index.html'), destination: path.join(__dirname, '../exportHtml', '/index.html') }
-    )
-  }
+  // if (arg === 'html') {
+  //   plugin.onStart[0].delete.push(path.join(__dirname, '../exportHtml/'))
+  //   plugin.onEnd[0].copy.push(
+  //     { source: path.join(__dirname, '../dist', '/index.html'), destination: path.join(__dirname, '../exportHtml', '/snapshot_template.html') }
+  //   )
+  // }
  webpackConfig.plugins.push(
    new fileManagerPlugin(plugin)
  )
--- a/nezha-fronted/package-lock.json
+++ b/nezha-fronted/package-lock.json
@@ -9097,6 +9097,11 @@
        "p-is-promise": "^1.1.0"
      }
    },
+    "intro.js": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/intro.js/-/intro.js-5.1.0.tgz",
+      "integrity": "sha512-zwWl/duTh00eeNcZRU4o4/xxloNYPFKs4n4lMRDNx59jZr+qRI0jSOnzqYMOuVftD4beGrmxBHz4k8qp9/dCMA=="
+    },
    "invariant": {
      "version": "2.2.4",
      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
@@ -18584,6 +18589,11 @@
      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.15.1.tgz",
      "integrity": "sha512-GBbz8qYCu0U2LNu4IcuFLZiuyninG4k26knvhL7GZG5Ncp4RR2VKDEH6g8gQ6I+UUBCvH2MBQVPSdxWe4DBkPw=="
    },
+    "vue-introjs": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/vue-introjs/-/vue-introjs-1.3.2.tgz",
+      "integrity": "sha512-Bj27iGimO6VKr/Ngxs5hr/Fh8ONSHmvTUj2gh1f5CGZC5vfF1Vb5VyetjXiDdMXhLsqeGSIhac6SbVNHwUh9yQ=="
+    },
    "vue-jest": {
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/vue-jest/-/vue-jest-1.4.0.tgz",
--- a/nezha-fronted/package.json
+++ b/nezha-fronted/package.json
@@ -8,7 +8,7 @@
    "dev": "node --max-old-space-size=10240 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --progress --config build/webpack.dev.conf.js",
    "dev:html": "node --max-old-space-size=10240 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
-    "build": "node build/build.js html && node build/build.js app",
+    "build": "node build/build.js app",
    "build:html": "node build/build.js html",
    "lint": "eslint --fix --ext .js,.vue src",
    "unit": "jest --config test/unit/jest.conf.js --coverage"
@@ -43,6 +43,7 @@
    "file-saver": "^2.0.2",
    "html-webpack-inline-source-plugin": "0.0.10",
    "html2canvas": "^1.4.1",
+    "intro.js": "^5.1.0",
    "jspdf": "^2.5.1",
    "jszip": "^3.9.1",
    "leaflet": "^1.7.1",
@@ -61,6 +62,7 @@
    "vue-draggable-resizable": "^2.3.0",
    "vue-grid-layout": "^2.3.12",
    "vue-i18n": "^8.15.1",
+    "vue-introjs": "^1.3.2",
    "vue-quill-editor": "^3.0.6",
    "vue-resource": "^1.5.1",
    "vue-router": "^3.0.1",
--- a/nezha-fronted/src/assets/css/common.scss
+++ b/nezha-fronted/src/assets/css/common.scss
@@ -220,9 +220,10 @@ td .nz-icon-gear:before{
 .time-no-data {
  text-align: center;
  width: 100%;
-  color: $--color-text-secondary;
+  // color: $--color-text-secondary;
+  color: $--color-text-regular;
  font-family: NotoSans !important;
-  font-size: 12px !important;
+  font-size: 13px !important;
 }
 .el-tree {
  background-color: $--background-color-empty !important;
@@ -421,6 +422,14 @@ input, textarea {
  float: unset;
  font-size: 10px;
  margin-left: 190px;
+  .message-next-continue{
+    color: $--color-text-primary;
+    font-weight: 400;
+  }
+  .message-next-content{
+    color: $--color-text-link;
+    font-weight: 600;
+  }
 }

 .document-copy-block:hover i{
--- a/nezha-fronted/src/assets/css/common/checkbox.scss
+++ b/nezha-fronted/src/assets/css/common/checkbox.scss
@@ -7,6 +7,21 @@
 .el-checkbox__input.is-checked .el-checkbox__inner {
  background-color: $--color-primary !important;
 }
+.el-checkbox__input.is-checked.is-disabled .el-checkbox__inner{
+  background-color: $--background-color-empty !important;
+  border-color: $--border-color-base !important;
+}
+.el-checkbox__input.is-disabled .el-checkbox__inner{
+  background-color: $--background-color-empty !important;
+  border-color: $--border-color-base !important;
+}
+.el-checkbox__input.is-checked.is-disabled .el-checkbox__inner:hover{
+  border-color: $--border-color-base !important;
+}
+.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
+  display: none !important;
+}
+
 .el-checkbox__inner {
  width: 16px !important;
  height: 16px !important;
@@ -22,7 +37,7 @@

 .el-checkbox__inner, .el-input__inner {
  border-color: $--checkbox-border-color;
-  background-color: $--background-color-empty;
+  background-color: $--background-color-empty !important;
 }
 .el-input__inner {
  border-color: $--border-color-light;
--- a/nezha-fronted/src/assets/css/common/loading.scss
+++ b/nezha-fronted/src/assets/css/common/loading.scss
@@ -1,11 +1,5 @@
 // https://github.com/loadingio/css-spinner/tree/master/dist 从当前链接现在在 在tools.js 的myLoading 进行判断处理
 // 高度 宽度 等细节 记得处理
-.my-loading-parent--relative {
-  height: 100%;
-  width: 100%;
-  position: relative !important;
-  display: inline-block;
-}
 .my-loading-parent-icon {
  height: auto;
  width: auto;
--- a/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
+++ b/nezha-fronted/src/assets/css/common/rightBoxCommon.scss
@@ -1,7 +1,7 @@
 .right-box, .right-sub-box {
  display: flex;
  flex-direction: column;
-  position: fixed;
+  position: fixed !important;
  right: 0;
  top: 50px;
  padding: 0;
--- a/nezha-fronted/src/assets/css/common/tableCommon.scss
+++ b/nezha-fronted/src/assets/css/common/tableCommon.scss
@@ -49,12 +49,10 @@
      .nz-icon-xingzhuang{
        color: $--color-text-regular;
        cursor: pointer;
-        transform:translateY(2px)
      }
      .nz-icon-a-xingzhuang2{
        color:#FF9219 !important;
        cursor: pointer;
-        transform:translateY(2px) scale(1.2);
      }
    }
  }
@@ -209,7 +207,7 @@
      color: $--color-primary;
    }
  }
-  .mt-10.table-container.nz-table2 {
+  .mt-10.table-container.nz-table-list {
    .el-table:not(.chart-table) {
      .gutter {
        position: fixed;
@@ -222,7 +220,7 @@
    }
  }
  /* 上滑resize工具条--end */
-  .nz-table2 {
+  .nz-table-list {
    position: relative;
    padding: 0 20px;
    width: 100%;
@@ -234,7 +232,10 @@
      width: 100%;
      border: 1px solid $--border-color-light;
      border-bottom: none;
-
+      .el-checkbox.is-disabled{
+        line-height: 1;
+        height: 16px;
+      }
      .caret-wrapper {
        height: 23px;
        .sort-caret.ascending {
@@ -349,7 +350,7 @@
  .el-table__body-wrapper .is-hidden, .el-table__header-wrapper .is-hidden {
    visibility: hidden;
  }
-  .nz-table2 {
+  .nz-table-list {
    .el-table--border td {
      border-right: none !important;
    }
@@ -397,7 +398,7 @@
  .main-container {
   padding: 0;
  }
-  .list-page .nz-table2 .el-table:not(.chart-table) .gutter {
+  .list-page .nz-table-list .el-table:not(.chart-table) .gutter {
    position: fixed;
    right: 31px;
    height: 42px;
@@ -551,7 +552,7 @@
  height: 100%;
 }
 .list-page.detail-view .nz-detail-view-right{
-  .nz-table2 .el-table--border {
+  .nz-table-list .el-table--border {
    height: calc(100% - 45px) !important;
    .gutter {
      position: fixed;
--- a/nezha-fronted/src/assets/css/components/chart/chart.scss
+++ b/nezha-fronted/src/assets/css/components/chart/chart.scss
@@ -1,7 +1,12 @@
 .temp-dropdown{
  border: none;
 }
-
+.my-loading-parent--relative {
+  position: relative;
+  display: inline-block;
+  height: 100%;
+  width: 100%;
+}
 .panel-chart {
  border: 1px solid $--chart-box-border-color;
  height: 100%;
@@ -190,6 +195,20 @@
      font-size: 12px;
    }
  }
+  .el-table{
+    background: $--background-color-empty;
+    border: 1px solid $--border-color-light;
+    .el-table--border::after{
+      background: $--border-color-light;
+    }
+    tr{
+      background: $--background-color-empty;
+      //border-bottom: 1px solid $--border-color-light !important;
+      th,td {
+        border-bottom: 1px solid $--border-color-light
+      }
+    }
+  }
 }
 .panel-chart.panel-chart--fullscreen {
  border: none;
@@ -213,7 +232,7 @@
  &>.overview{
    padding: 10px;
  }
-  &>.nz-table2{
+  &>.nz-table-list{
    padding-top: 10px !important;
  }
 }
@@ -548,3 +567,20 @@
  justify-content: space-between;
  align-items: center;
 }
+.graph-icon-info-box{
+  position: absolute;
+  top: 50%;
+  right: 5%;
+  display: flex;
+  width: 140px;
+  flex-direction: column;
+  transform: translateY(-50%);
+  .graph-icon-content {
+    font-size: 20px;
+    margin-bottom: 10px;
+    color: $--color-monitor;
+    .graph-icon-label{
+      margin-left: 5px;
+    }
+  }
+}
--- a/nezha-fronted/src/assets/css/components/common/alert/alertMessageInfo.scss
+++ b/nezha-fronted/src/assets/css/components/common/alert/alertMessageInfo.scss
@@ -348,9 +348,9 @@
                  .nz-alert-tag__content {
                    padding-left: 6px;
                    padding-right: 6px;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
+                    // display: flex;
+                    // align-items: center;
+                    // justify-content: center;
                  }
                }

@@ -412,18 +412,18 @@
                    .nz-alert-tag__label {
                      padding-left: 10px;
                      padding-right: 10px;
-                      display: flex;
-                      align-items: center;
-                      justify-content: center;
+                      // display: flex;
+                      // align-items: center;
+                      // justify-content: center;
                    }

                    .nz-alert-tag__content {
                      padding-left: 6px;
                      padding-right: 6px;
                      color: $--color-text-primary;
-                      display: flex;
-                      align-items: center;
-                      justify-content: center;
+                      // display: flex;
+                      // align-items: center;
+                      // justify-content: center;
                    }
                  }

--- a/nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss
+++ b/nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss
@@ -31,7 +31,7 @@
  .pagination-bottom {
    bottom: 8px;
  }
-  &>.nz-table2 {
+  &>.nz-table-list {
    height: 100%;
    padding: 20px 20px 10px 20px !important;
    box-sizing: border-box;
@@ -88,7 +88,7 @@
 }
 .list-page {
  .sub-box.bottom-box {
-    .nz-table2 .el-table--border {
+    .nz-table-list .el-table--border {
      .gutter {
        position: fixed;
        right: 31px;
@@ -115,13 +115,13 @@
      height: 100%;
      background-color: $--background-color-base;

-      &>.nz-table2 {
+      &>.nz-table-list {
        height: calc(100% - 92px);
        padding: 20px 20px 0;
      }
    }
    .chart-list{
-      .nz-table2 {
+      .nz-table-list {
        box-sizing: border-box;
        padding: 0;
        height: 100%;
@@ -150,7 +150,7 @@
 }
 .bottom-log {
  padding: 15px;
-  height: 100%;
+  height: auto;
 }
 .bottom-common {
  padding: 20px;
@@ -177,16 +177,16 @@
 .bottom-box .sub-container{
  height: calc(100% - 50px);
 }
-.bottom-box .sub-container .nz-table2 {
+.bottom-box .sub-container .nz-table-list {
  height: calc(100% - 20px);
  .bottom-box__top .my-loading-box {
    height: calc(100% + 20px) !important;
  }
 }
-.asset-detail .sub-container .nz-table2 {
+.asset-detail .sub-container .nz-table-list {
  height: 100%;
 }
-.endpoint-tab-new .sub-container .nz-table2 {
+.endpoint-tab-new .sub-container .nz-table-list {
  height: 100%;
 }
 /* end--二级顶部工具栏*/
--- a/nezha-fronted/src/assets/css/components/common/detailView/view/detailViewRight.scss
+++ b/nezha-fronted/src/assets/css/components/common/detailView/view/detailViewRight.scss
@@ -9,7 +9,7 @@
      padding: 0;
    }

-    .sub-box .sub-list__tabs .chart-list .nz-table2 {
+    .sub-box .sub-list__tabs .chart-list .nz-table-list {
      padding: 20px;
      height: 100%;
    }
@@ -36,14 +36,14 @@
      & > div {
        height: 100%;

-        & > .nz-table2 {
+        & > .nz-table-list {
          height: calc(100% - 92px);
          padding: 20px 20px 0;
        }
      }

      .chart-list {
-        .nz-table2 {
+        .nz-table-list {
          box-sizing: border-box;
          padding: 0;
        }
--- a/nezha-fronted/src/assets/css/components/common/globalSearch/globalSearch.scss
+++ b/nezha-fronted/src/assets/css/components/common/globalSearch/globalSearch.scss
@@ -95,6 +95,7 @@
        width: 100%;
        box-sizing: border-box;
        overflow-y: auto;
+        overflow-x: hidden;
      }
      .list-item{
        height: 64px;
--- a/nezha-fronted/src/assets/css/components/common/popBox/selectDashboard.scss
+++ b/nezha-fronted/src/assets/css/components/common/popBox/selectDashboard.scss
@@ -77,7 +77,7 @@
  display: flex;
  justify-content: space-between;
  .panel-select-left{
-    width: 170px;
+    width: 180px;
    height: 100%;
    box-sizing: border-box;
    border-right:1px solid $--border-color-base;
@@ -98,26 +98,26 @@
        height: 36px;
        cursor: pointer;
        i{
-          margin-left: 20px;
-          margin-right: 6px;
-          width: 22px;
+          margin-left: 12px;
+          margin-right: 5px;
+          width: 20px;
          display: flex;
          justify-content: center;
          color: $--color-text-regular;
        }
      }
      .panel-select-item:hover{
-        color: #FA901C; 
+        color: $--color-primary; 
        background: $--background-color-base;
        i{
-          color: #FA901C;
+          color: $--color-primary;
        }
      }
      .panel-select-item.active{
-        color: #FA901C;  
+        color: $--color-primary;  
        background: $--background-color-base;
        i{
-          color: #FA901C;
+          color: $--color-primary;
        }
      }
    }
@@ -145,7 +145,7 @@
  }
  .pop-item-wider{
    flex: 1;
-    width: calc(100% - 170px);
+    width: calc(100% - 180px);
    padding-top: 0;
    .panel-select-header{
      margin-top: 12px;
@@ -155,9 +155,14 @@
  .nz-icon-xingzhuang{
    color: $--color-text-regular;
    font-weight: normal;
+    cursor: pointer ;
  }
  .nz-icon-a-xingzhuang2{
    color:#FF9219 !important;
-    transform: scale(1.2);
+    cursor: pointer ;
+  }
+  .highlight-keyword{
+    color:$--color-primary;
+    background: none;
  }
 }
--- a/nezha-fronted/src/assets/css/components/common/project/topology.scss
+++ b/nezha-fronted/src/assets/css/components/common/project/topology.scss
@@ -159,12 +159,11 @@
    color: #e2f3ef;
    font-size: 44px;
    position: absolute;
-    top: 1px;
+    top: 0px;
    left: 2px;
-    transform: scale(0.95);
-    z-index: 0;
+    // transform: scale(1.1);
+    z-index: -1;
  }
-
  .network-pop .error-model-stat .nz-icon-liubianxing {
    color: #FADED7;
  }
@@ -490,14 +489,14 @@
  padding:0 !important;
  width: calc(100% - 2px);
  height: calc(100% - 2px) !important;
-  .nz-table2{
+  .nz-table-list{
    padding: 0 !important;
    height: 100%;
  }
 }
 .from-project{
  padding: 0px 10px 0 0 !important;
-  .nz-table2{
+  .nz-table-list{
    padding: 0;
    box-sizing: content-box;
    height: calc(100% - 50px);
--- a/nezha-fronted/src/assets/css/components/common/table/settings/backupsTable.scss
+++ b/nezha-fronted/src/assets/css/components/common/table/settings/backupsTable.scss
@@ -1,5 +1,5 @@
 .backups-table{
-  .nz-table2 {
+  .nz-table-list {
      .el-table__row{
        td:last-of-type{
          // border-bottom: 1px solid $--border-color-light !important;
@@ -33,7 +33,7 @@
          }
        }
        .table-operation-button {
-            border: none;
+          border: none;
          background-color: $--color-primary;
          color: $--button-primary-color;
          display: flex;
@@ -56,4 +56,18 @@
    .nz-icon-shujubeifenhuifu::before{
      font-size: 12px;
    }
+    .el-table--border td:first-child .cell{
+      padding-left: 20px !important;
+    }
+
+
+
+    .el-table__empty-block{
+      .el-table__empty-text{
+        .table-no-data{
+          height: 200px;
+          padding-top: 70px;
+        }
+      }
+    }
 }
--- a/nezha-fronted/src/assets/css/components/common/table/settings/userTable.scss
+++ b/nezha-fronted/src/assets/css/components/common/table/settings/userTable.scss
@@ -31,4 +31,13 @@
    font-size: 14px;
    line-height: 14px;
  }
+  .user-name-td{
+    display: flex;
+    align-items: center;
+    .user-online{
+      margin-right: 5px;
+      margin-left: -10px;
+      color: #38cc20;
+    }
+  }
 }
--- a/nezha-fronted/src/assets/css/components/common/timePicker.scss
+++ b/nezha-fronted/src/assets/css/components/common/timePicker.scss
@@ -115,7 +115,8 @@

 .date-range-text {
  color: $--color-text-regular;
-  font-size: 14px;
+  // font-size: 14px;
+  font-size: 13px;
  // min-width: 150px;
  flex-direction: row;
  flex-wrap: nowrap;
--- a/nezha-fronted/src/assets/css/components/introjs/introjs-dark.scss
+++ b/nezha-fronted/src/assets/css/components/introjs/introjs-dark.scss
@@ -0,0 +1,243 @@
+/*
+Dark theme for IntroJs
+By: Khashayar Pourdeilami (http://kpourdeilami.github.io)
+for: IntroJs (https://github.com/usablica/intro.js)
+*/
+.introjs-overlay {
+  position: absolute;
+  z-index: 999999;
+  background:#fff;
+  -webkit-transition: all 0.3s ease-out;
+     -moz-transition: all 0.3s ease-out;
+      -ms-transition: all 0.3s ease-out;
+       -o-transition: all 0.3s ease-out;
+          transition: all 0.3s ease-out;
+}
+
+.introjs-fixParent {
+  z-index: auto !important;
+  opacity: 1.0 !important;
+}
+
+.introjs-showElement,
+tr.introjs-showElement > td,
+tr.introjs-showElement > th {
+  z-index: 9999999 !important;
+}
+
+.introjs-relativePosition,
+tr.introjs-showElement > td,
+tr.introjs-showElement > th {
+  position: relative;
+}
+
+.introjs-helperLayer {
+  position: absolute;
+  z-index: 9999998;
+  background:#656D78;
+  -webkit-transition: all 0.3s ease-out;
+     -moz-transition: all 0.3s ease-out;
+      -ms-transition: all 0.3s ease-out;
+       -o-transition: all 0.3s ease-out;
+          transition: all 0.3s ease-out;
+}
+
+.introjs-helperNumberLayer {
+  position: absolute;
+
+  z-index: 9999999999 !important;
+  padding: 10px;
+  font-family: Arial, verdana, tahoma;
+  font-size: 13px;
+  top:-40px;
+  font-weight: bold;
+  color: white;
+  text-align: center;
+  background:#434A54;
+  width: 20px;
+  height:20px;
+  line-height: 20px;
+}
+
+.introjs-arrow {
+  border: 5px solid #434A54;
+  content:'';
+  position: absolute;
+}
+.introjs-arrow.top {
+  top: -10px;
+  border-top-color:transparent;
+  border-right-color:transparent;
+  border-bottom-color:#434A54;
+  border-left-color:transparent;
+}
+.introjs-arrow.top-right {
+  top: -10px;
+  right: 10px;
+  border-top-color:transparent;
+  border-right-color:transparent;
+  border-bottom-color:#434A54;
+  border-left-color:transparent;
+}
+.introjs-arrow.top-middle {
+  top: -10px;
+  left: 50%;
+  margin-left: -5px;
+  border-top-color:transparent;
+  border-right-color:transparent;
+  border-bottom-color:#434A54;
+  border-left-color:transparent;
+}
+.introjs-arrow.right {
+  right: -10px;
+  top: 10px;
+  border-top-color:transparent;
+  border-right-color:transparent;
+  border-bottom-color:transparent;
+  border-left-color:#434A54;
+}
+.introjs-arrow.bottom {
+  bottom: -10px;
+  border-top-color:#434A54;
+  border-right-color:transparent;
+  border-bottom-color:transparent;
+  border-left-color:transparent;
+}
+.introjs-arrow.left {
+  left: -10px;
+  top: 10px;
+  border-top-color:transparent;
+  border-right-color:#434A54;
+  border-bottom-color:transparent;
+  border-left-color:transparent;
+}
+
+.introjs-tooltip {
+  position: absolute;
+  padding: 10px;
+  background-color: #434A54;
+  min-width: 200px;
+  padding-top:30px;
+
+  max-width: 300px;
+  color:#fff;
+  -webkit-transition: opacity 0.1s ease-out;
+     -moz-transition: opacity 0.1s ease-out;
+      -ms-transition: opacity 0.1s ease-out;
+       -o-transition: opacity 0.1s ease-out;
+          transition: opacity 0.1s ease-out;
+}
+
+.introjs-tooltipbuttons {
+  text-align: right;
+  position:relative;
+  bottom:-44px;
+  margin-left:-10px;
+  margin-right:-10px;
+  padding:5px;
+  background:#656D78;
+}
+
+/*
+ Buttons style by http://nicolasgallagher.com/lab/css3-github-buttons/
+ Changed by Afshin Mehrabani
+ Further modified by: Khashayar P.
+*/
+.introjs-button {
+  position: relative;
+  overflow: visible;
+  display: inline-block;
+  padding: 0.3em 0.8em;
+  border: 2px solid #fff;
+  margin: 0;
+  text-decoration: none;
+  font: 11px/normal sans-serif;
+  color: #fff !important;
+  white-space: nowrap;
+  cursor: pointer;
+  outline: none;
+  -webkit-background-clip: padding;
+  -moz-background-clip: padding;
+  -o-background-clip: padding-box;
+  /*background-clip: padding-box;*/ /* commented out due to Opera 11.10 bug */
+  /* IE hacks */
+  zoom: 1;
+  *display: inline;
+  margin-top: 10px;
+}
+
+.introjs-button:hover {
+  text-decoration: none;
+  color:#434A54 !important;
+  background:#fff;
+}
+
+.introjs-button:focus,
+.introjs-button:active {
+  background:#fff !important;
+  color:#434A54 !important;
+}
+
+/* overrides extra padding on button elements in Firefox */
+.introjs-button::-moz-focus-inner {
+  padding: 0;
+  border: 0;
+}
+
+.introjs-skipbutton {
+  margin-right: 5px;
+  color: #fff;
+}
+
+.introjs-prevbutton {
+
+  border-right: none;
+}
+
+
+.introjs-disabled, .introjs-disabled:hover, .introjs-disabled:focus {
+  color: #fff;
+  box-shadow: none;
+  cursor: default;
+  background:transparent;
+  border-color:transparent;
+}
+
+.introjs-bullets {
+  text-align: center;
+  display:none;
+}
+.introjs-bullets ul {
+  clear: both;
+  margin: 15px auto 0;
+  padding: 0;
+  display: inline-block;
+}
+.introjs-bullets ul li {
+  list-style: none;
+  float: left;
+  margin: 0 2px;
+}
+.introjs-bullets ul li a {
+  display: block;
+  width: 8px;
+  height: 8px;
+  background: rgba(255,255,255,0.1);
+  border-radius: 10px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  text-decoration: none;
+}
+.introjs-bullets ul li a:hover {
+  background: rgba(255,255,255,0.2);
+}
+.introjs-bullets ul li a.active {
+  background: rgba(255,255,255,0.2);
+}
+.introjsFloatingElement {
+  position: absolute;
+  height: 0;
+  width: 0;
+  left: 50%;
+  top: 50%;
+}
--- a/nezha-fronted/src/assets/css/components/introjs/introjs.scss
+++ b/nezha-fronted/src/assets/css/components/introjs/introjs.scss
--- a/nezha-fronted/src/assets/css/components/page/config/backups.scss
+++ b/nezha-fronted/src/assets/css/components/page/config/backups.scss
@@ -193,14 +193,17 @@
  .el-checkbox-button__inner{
    background-color:$--background-color-empty;
  }
+  .el-checkbox-button.is-checked{
+    border: 1px solid #fbb569 !important;
+  }
  .el-checkbox-button.is-checked .el-checkbox-button__inner {
    color: #fff;
    background-color: #FA901C;
    border-color: #FA901C;
-    border: 1px solid #FA901C;
-    margin-right: -1px;
+    // margin-right: -1px;
    -webkit-box-shadow: -1px 0 0 0 #fcbc77;
    box-shadow: -1px 0 0 0 #fcbc77;
+    border-radius: 0;
  }
  .nz-icon-delete:before{
    color: $--color-text-regular;
--- a/nezha-fronted/src/assets/css/components/page/config/operationRecord.scss
+++ b/nezha-fronted/src/assets/css/components/page/config/operationRecord.scss
@@ -32,3 +32,41 @@
    background-color: $--background-color-1;
  }
 }
+.operation-log{
+  .main-list{
+    .api-key{
+      position: relative;
+     .pop-custom{
+        position: absolute;
+        top: -20px;
+        right: 0;
+    }
+    } 
+    .main-container{
+      background-color: $--background-color-empty;
+    }
+    .nz-table-list{
+      position: relative;
+      .top-tool-right{
+        position: absolute !important;
+        top: -55px !important;
+        right: 0 !important;
+      }
+      .nz-table-list{
+        width: 100%;
+        height: 100% !important;
+        position: absolute !important;
+        padding-left: 0 !important;
+        padding-right: 0 !important;
+        top: 0 !important;
+        left: 0;
+        #api-key-tab{
+          height: calc(100% - 78px) !important;
+        }
+        .el-table__body-wrapper{
+          overflow-x: hidden !important;
+        }
+      }
+    }
+  }
+}
--- a/nezha-fronted/src/assets/css/components/page/config/profile.scss
+++ b/nezha-fronted/src/assets/css/components/page/config/profile.scss
@@ -228,7 +228,7 @@
    padding: 0;
    pxbox-shadow: 0 1px 2px 0 rgba(0,0,0,0.06);
    border-radius: 2px;
-    .nz-table2 {
+    .nz-table-list {
      height: calc(100% - 69px);
    }
  }
@@ -331,3 +331,10 @@
  width: 320px;
  margin: 40px auto
 }
+.profile{
+  #my-datetime-picker{
+    width: 640px;
+    height: 32px;
+  }
+}
+
--- a/nezha-fronted/src/assets/css/components/page/dashboard/explore/logTab.scss
+++ b/nezha-fronted/src/assets/css/components/page/dashboard/explore/logTab.scss
@@ -15,7 +15,7 @@
      text-align: center;
    }
  }
-  .log-table .nz-table2 {
+  .log-table .nz-table-list {
    padding: 10px 0 0 0;
    position: relative;
    background-color: $--background-color-empty;
@@ -133,11 +133,11 @@
 .chart-log.log-detail {
  height: 100%;
  .log-table {
-    .nz-table2::before{
+    .nz-table-list::before{
      display: none;
      height: 0px;
    }
-    .nz-table2 {
+    .nz-table-list {
      padding: 10px;
      box-sizing: border-box;
      .el-table__body-wrapper {
--- a/nezha-fronted/src/assets/css/components/page/dashboard/overview/overview2.scss
+++ b/nezha-fronted/src/assets/css/components/page/dashboard/overview/overview2.scss
@@ -25,7 +25,7 @@
  .el-carousel__indicator--horizontal.is-active .el-carousel__button{
    opacity: 1;
  }
-  .nz-table2 {
+  .nz-table-list {
    height: 100% !important;
  }
  .chart-body {
--- a/nezha-fronted/src/assets/css/components/page/dashboard/panel.scss
+++ b/nezha-fronted/src/assets/css/components/page/dashboard/panel.scss
@@ -25,7 +25,7 @@
    .main-container {
      padding: 0 !important;
    }
-    .nz-table2.h100 {
+    .nz-table-list.h100 {
      height: 100% !important;
    }
    .right-bottom-zoom {
--- a/nezha-fronted/src/assets/css/components/page/monitor/project/project.scss
+++ b/nezha-fronted/src/assets/css/components/page/monitor/project/project.scss
@@ -36,7 +36,7 @@
        .top-tools div:nth-of-type(1) {
          color: $--color-text-primary;
        }
-        .nz-table2 {
+        .nz-table-list {
          padding: 0 !important;
        }
        .right-bottom-zoom {
--- a/nezha-fronted/src/assets/css/components/page/tool/ping.scss
+++ b/nezha-fronted/src/assets/css/components/page/tool/ping.scss
@@ -92,7 +92,7 @@
    display: flex;
    flex-direction: column;
  }
-  .nz-table2{
+  .nz-table-list{
    height: auto !important;
    overflow: hidden;
    flex: 1;
@@ -159,7 +159,7 @@
      }
    }
  }
-  .nz-table2{
+  .nz-table-list{
    flex: 1 !important;
  }
 }
--- a/nezha-fronted/src/assets/css/components/page/tool/trace.scss
+++ b/nezha-fronted/src/assets/css/components/page/tool/trace.scss
@@ -92,7 +92,7 @@
    display: flex;
    flex-direction: column;
  }
-  .nz-table2{
+  .nz-table-list{
    height: auto !important;
    overflow: hidden;
    flex: 1;
@@ -159,7 +159,7 @@
      }
    }
  }
-  .nz-table2{
+  .nz-table-list{
    flex: 1 !important;
  }
 }
--- a/nezha-fronted/src/assets/css/index.scss
+++ b/nezha-fronted/src/assets/css/index.scss
@@ -32,6 +32,7 @@ html {
  @import './common/index.scss'; // 加载通用样式
  @import './common.scss';
  @import '../stylus/main.scss';
+  @import './components/introjs/introjs.scss';
 }

 .theme-dark {
@@ -42,4 +43,6 @@ html {
  @import './common/index.scss'; // 加载通用样式
  @import './common.scss';
  @import '../stylus/main.scss';
+  @import './components/introjs/introjs.scss';
+  @import './components/introjs/introjs-dark.scss';
 }
--- a/nezha-fronted/src/components/chart/chart/chart-table.vue
+++ b/nezha-fronted/src/components/chart/chart/chart-table.vue
@@ -43,11 +43,11 @@
            </span>
            <ul slot="dropdown" v-show="dropdownMenuShow"  :id="'dropdownUl'+chartIndex"  class="el-dropdown-menu nz-chart-dropdown"  style="" >
              <li  @click="editChart" class="el-dropdown-menu__item">
-                <i class="nz-icon nz-icon-edit" style="font-size: 16px;"></i><span>{{$t('dashboard.edit')}}</span></li>
+                <i class="nz-icon nz-icon-edit" style="font-size: 16px;"></i><span>{{$t('overall.edit')}}</span></li>
              <li  v-has="'main_delete'" class="el-dropdown-menu__item" @click="removeChart">
-                <i class="nz-icon nz-icon-delete" style="font-size: 16px;"></i>{{$t('dashboard.delete')}}</li>
+                <i class="nz-icon nz-icon-delete" style="font-size: 16px;"></i>{{$t('overall.delete')}}</li>
              <li  v-has="'main_add'" class="el-dropdown-menu__item" @click="duplicate">
-                <i class="el-icon-copy-document" style="font-size: 16px;"></i>{{$t('dashboard.duplicate')}}</li>
+                <i class="el-icon-copy-document" style="font-size: 16px;"></i>{{$t('overall.duplicate')}}</li>
              <li  v-has="'main_edit'"  v-if="from !== 'chartTemp'&&chartData.pid" class="el-dropdown-menu__item" @click="$emit('sync')">
                <i class="nz-icon nz-icon-sync" style="font-size: 16px;"></i>{{$t('overall.syncChart')}}</li>
            </ul>
@@ -57,16 +57,16 @@
          <el-table :id="'tableContainer'+chartIndex" ref="tableContainer" :height="tableHeight" class="chart-table"
                    :data="seriesItem" border tooltip-effect="light" v-cloak
                    @sort-change="tableDataSort" >
-            <el-table-column :label="$t('dashboard.panel.chartTableColumn.time')" min-width="100" prop="time"
+            <el-table-column :label="$t('overall.time')" min-width="100" prop="time"
                             :sort-orders="['ascending', 'descending']" :sortable="'custom'"></el-table-column>
            <el-table-column :show-overflow-tooltip="true" prop="element"
-                             :label="$t('dashboard.panel.chartTableColumn.element')" min-width="260"
+                             :label="$t('dashboard.panel.chartForm.element')" min-width="260"
                             :sort-orders="['ascending', 'descending']" :sortable="'custom'">
              <template slot-scope="scope">
                {{ scope.row.element.alias?scope.row.element.alias:scope.row.element.element}}
              </template>
            </el-table-column>
-            <el-table-column :label="$t('dashboard.panel.chartTableColumn.value')" class-name="costom-value" min-width="90" prop="value"
+            <el-table-column :label="$t('overall.value')" class-name="costom-value" min-width="90" prop="value"
                             :resizable="false" :sort-orders="['ascending', 'descending']" :sortable="'custom'">
              <template slot-scope="scope">
                <div :style="{color:scope.row.mapping?scope.row.mapping.color.text:'#000',background:scope.row.mapping?scope.row.mapping.color.bac:'#fff'}" >
@@ -79,7 +79,7 @@
                      ref="Pagination" :append-to-body="false" pop-class="out-popper-fix"></Pagination>
        </div>
        <!--全屏-->
-        <el-dialog class="nz-dialog table-chart-dialog" :title="$t('dashboard.panel.view')" :visible.sync="screenModal"
+        <el-dialog class="nz-dialog table-chart-dialog" :title="$t('overall.view')" :visible.sync="screenModal"
                   width="96%" @close="screenModal = false" :modal-append-to-body="false">
          <div slot="title">
            <span class="nz-dialog-title">{{data.name}}</span>
@@ -90,16 +90,16 @@
          <el-table :data="seriesItemScreen" border height="95%" style="margin-top: 10px;"
                    ref="tableScreen"
                    @sort-change="tableDataSortScreen" tooltip-effect="light">
-            <el-table-column :label="$t('dashboard.panel.chartTableColumn.time')" min-width="100" prop="time"
+            <el-table-column :label="$t('overall.time')" min-width="100" prop="time"
                             :sort-orders="['ascending', 'descending']" :sortable="'custom'"></el-table-column>
            <el-table-column :show-overflow-tooltip="true" prop="element"
-                             :label="$t('dashboard.panel.chartTableColumn.element')" min-width="420"
+                             :label="$t('dashboard.panel.chartForm.element')" min-width="420"
                             :sort-orders="['ascending', 'descending']" :sortable="'custom'">
              <template slot-scope="scope">
                {{ scope.row.element.alias?scope.row.element.alias:scope.row.element.element}}
              </template>
            </el-table-column>
-            <el-table-column :label="$t('dashboard.panel.chartTableColumn.value')" class-name="costom-value" min-width="90" prop="value"
+            <el-table-column :label="$t('overall.value')" class-name="costom-value" min-width="90" prop="value"
                             :resizable="false" :sort-orders="['ascending', 'descending']" :sortable="'custom'">
              <template slot-scope="scope">
                <div :style="{color:scope.row.mapping?scope.row.mapping.color.text:'#000',background:scope.row.mapping?scope.row.mapping.color.bac:'#fff'}" >
--- a/nezha-fronted/src/components/chart/chart/chartGroup.vue
+++ b/nezha-fronted/src/components/chart/chart/chartGroup.vue
@@ -54,14 +54,14 @@ export default {

    },
    initChart () {
-      setTimeout(() => {
-        this.dataList = this.dataList.map(item => {
-          return {
-            ...item
-            // hide: item.name.indexOf(this.filter.searchName) === -1, // 搜索条件
-          }
-        })
-      }, 100)
+      // setTimeout(() => {
+      //   this.dataList = this.dataList.map(item => {
+      //     return {
+      //       ...item
+      //       // hide: item.name.indexOf(this.filter.searchName) === -1, // 搜索条件
+      //     }
+      //   })
+      // }, 100)
    }
  },
  watch: {
--- a/nezha-fronted/src/components/chart/chart/chartLog.vue
+++ b/nezha-fronted/src/components/chart/chart/chartLog.vue
@@ -37,7 +37,7 @@
        style="height: 100%"
        :show-header="false"
        ref="logTable"
-        class="nz-table2"
+        class="nz-table-list"
        size="mini"
        v-if="tableData.length"
      >
--- a/nezha-fronted/src/components/chart/chart/chartMap.vue
+++ b/nezha-fronted/src/components/chart/chart/chartMap.vue
@@ -195,7 +195,7 @@ export default {
            <div class="partition"></div>
            <div class="legend-value legend-value-agent">
            <div class="map-asset">
-                <div class="progress-title">${self.$t('guide.agent')} ${self.$t('overall.normal')}</div>
+                <div class="progress-title">${self.$t('guide.agent')} ${self.$t('config.agent.up')}</div>
                <div class="success-progress progress-box">
                    <div class="top-progress" style="width: ${(dcStat.agent.up / (dcStat.agent.up + dcStat.agent.down)) * 100}%"></div>
                    <div style="width: 100%" class="bottom-progress"></div>
@@ -203,7 +203,7 @@ export default {
                <div class="success-progress progress-content">${dcStat.agent.up}</div>
             </div>
             <div class="map-asset">
-                <div class="progress-title">${self.$t('guide.agent')} ${self.$t('overall.unusual')}</div>
+                <div class="progress-title">${self.$t('guide.agent')} ${self.$t('asset.down')}</div>
                <div class="error-progress progress-box">
                    <div class="top-progress" style="width: ${(dcStat.agent.down / (dcStat.agent.up + dcStat.agent.down)) * 100}%"></div>
                    <div style="width: 100%" class="bottom-progress"></div>
--- a/nezha-fronted/src/components/chart/chart/chartStat.vue
+++ b/nezha-fronted/src/components/chart/chart/chartStat.vue
@@ -4,7 +4,7 @@
      class="chart-stat-item"
      v-for="(item,index) in statData"
      :key="index"
-      @mouseenter="statMouseEnter(item)"
+      @mouseenter="statMouseEnter(item,$event)"
      @mouseleave="statMouseleave(item)"
      :class="statData.length===1 ?'only-stat' : ''"
      :style="{
@@ -163,18 +163,42 @@ export default {
        this.tooltip.x = e.pageX + 15
      }
    },
-    statMouseEnter (that) {
+    statMouseEnter (that, e) {
      this.tooltip.title = that.legend
      this.tooltip.value = that.showValue
      this.tooltip.mapping = that.mapping
      this.tooltip.show = true
+      this.$nextTick(() => {
+        const windowWidth = window.innerWidth// 窗口宽度
+        const windowHeight = window.innerHeight// 窗口高度
+        const box = document.getElementById(`chart-canvas-tooltip-${this.chartId}`)
+        if (box) {
+          const boxWidth = box.offsetWidth
+          const boxHeight = box.offsetHeight
+          if (e.pageX < (windowWidth / 2)) { // 说明鼠标在左边放不下提示框
+            this.tooltip.x = e.pageX + 15
+          } else {
+            this.tooltip.x = e.pageX - boxWidth - 15
+          }
+          if (e.pageY + 50 + boxHeight < windowHeight) { // 说明鼠标上面放不下提示框
+            this.tooltip.y = e.pageY + 15
+          } else {
+            this.tooltip.y = e.pageY - boxHeight - 10
+          }
+        } else {
+          this.tooltip.y = e.pageY + 15
+          this.tooltip.x = e.pageX + 15
+        }
+      })
    },
    statMouseleave (taht) {
      this.tooltip.show = false
    },
    getLayout () {
-      this.boxWidth = this.$refs['chart-stat-box'].offsetWidth - 3 * this.boxPadding
-      this.boxHeight = this.$refs['chart-stat-box'].offsetHeight - 3 * this.boxPadding
+      try {
+        this.boxWidth = this.$refs['chart-stat-box'].offsetWidth - 3 * this.boxPadding
+        this.boxHeight = this.$refs['chart-stat-box'].offsetHeight - 3 * this.boxPadding
+      } catch (error) {}
      return new Promise(resolve => {
        let rateMax = 0
        let col = 0
--- a/nezha-fronted/src/components/chart/chart/chartTable.vue
+++ b/nezha-fronted/src/components/chart/chart/chartTable.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="nz-table2" style="height: 100%;padding: 0 10px 10px 10px;box-sizing: border-box">
+  <div class="nz-table-list" style="height: 100%;padding: 0 10px 10px 10px;box-sizing: border-box">
    <el-table
      ref="dataTable"
      class="chart-table"
--- a/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue
+++ b/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue
@@ -95,7 +95,7 @@ export default {
        return
      }
      const decimals = this.chartInfo.param.decimals || 2
-      const { minTime, maxTime, minValue, maxValue, copies, unit, dot } = this.getMinMaxFromData(this.chartData, this.chartInfo.unit) // 此处时间是秒
+      const { minTime, maxTime, minValue, maxValue, copies, unit, dot } = this.getMinMaxFromData(this.chartData, this.chartInfo.unit) //
      chartOption.xAxis.axisLabel.formatter = this.xAxisLabelFormatter(minTime, maxTime)// 需转为毫秒
      chartOption.tooltip.formatter = this.tooltipFormatter(this.chartInfo.param.stack)
      chartOption.tooltip.position = this.tooltipPosition
@@ -145,9 +145,7 @@ export default {
          datas = [...datas, ...data.values]
        })
      })
-      const timeSorted = datas.sort((a, b) => {
-        return Number(a[0]) - Number(b[0])
-      })
+      const timeSorted = this.$loadsh.sortBy(datas, function (o) { return o[0] })
      const valueSorted = datas.sort((a, b) => {
        const a1 = isNaN(a[1]) && !a[1] ? 0 : Number(a[1])
        const b1 = isNaN(b[1]) && !b[1] ? 0 : Number(b[1])
--- a/nezha-fronted/src/components/chart/chart/chartTopology.vue
+++ b/nezha-fronted/src/components/chart/chart/chartTopology.vue
@@ -1,6 +1,13 @@
 <template>
  <div :ref="`chart-canvas-${chartId}`" style="height: 100%;width: 100%;overflow: hidden">
    <div :id="`chart-canvas-${chartId}`" class="chart__canvas chart-svg"></div>
+    <div class="graph-icon-info-box">
+      <div v-for="(item,index) in graphIconArr" :key="index">
+        <div class="graph-icon-content" @mouseenter="graphIconEnter(item)" @mouseleave="graphIconLeave(item)">
+          <i :class="item.class"/><span class="graph-icon-label">{{item.label}}</span>
+        </div>
+      </div>
+    </div>
    <alertLabel
      v-if="alertLabelShow"
      :id="alertLabelId"
@@ -59,7 +66,15 @@ export default {
      isDrag: false,
      highlightId: '',
      highlightAll: [],
-      radiusArr: [14, 20, 27]
+      radiusArr: [14, 20, 27],
+      graphIconArr: [],
+      nzIcon: [
+        { class: 'nz-icon nz-icon-overview-project', type: 'asset', label: this.$t('overall.asset') },
+        { class: 'nz-icon nz-icon-Datacenter2', type: 'datacenter', label: this.$t('overall.dc') },
+        { class: 'nz-icon nz-icon-project', type: 'project', label: this.$t('overall.project') },
+        { class: 'nz-icon nz-icon-overview-module', type: 'module', label: this.$t('overall.module') },
+        { class: 'nz-icon nz-icon-overview-endpoint', type: 'endpoint', label: this.$t('asset.endpoint') }
+      ]
    }
  },
  methods: {
@@ -210,7 +225,9 @@ export default {
      let node = nodeAll.data(nodes)
        .enter().append('g')
        .attr('class', 'node animation')
-        .attr('id', function (d) { return 'node' + d.id })
+        .attr('id', function (d) {
+          return 'node' + d.id
+        })
        .attr('style', function (d) {
          let str = 'opacity:'
          str += 1
@@ -452,12 +469,16 @@ export default {
            })
            nodes.push(...res.data.nodes)
            nodes = lodash.uniqBy(nodes, 'id')
+            self.data.nodes = nodes
            simulation.stop()
            node = node
              .data(nodes)
              .join(
                enter => enter.append('g').attr('class', 'node')
-                  .attr('id', function (d) { return 'node' + d.id })
+                  .attr('id', function (child) {
+                    return 'node' + child.id
+                  }
+                  )
                  .call(drag(simulation))
                  .on('mouseleave', nodeMouseout)
                  .on('click', showChildren),
@@ -497,7 +518,9 @@ export default {
            .data(nodes)
            .join(
              enter => enter.append('g').attr('class', 'node')
-                .attr('id', function (d) { return 'node' + d.id })
+                .attr('id', function (child) {
+                  return 'node' + child.id
+                })
                .call(drag(simulation))
                .on('mouseleave', nodeMouseout)
                .on('click', showChildren),
@@ -526,6 +549,7 @@ export default {
          simulation.nodes(nodes)
          simulation.force('link').links(links)
          simulation.restart().tick()
+          self.data.nodes = nodes
        }
      }

@@ -536,6 +560,10 @@ export default {
          if (document.getElementById('#circle' + d.id)) {
            return
          }
+          box.attr('id', 'node' + d.id)
+          if (document.getElementById('node' + d.id)) {
+            document.getElementById('node' + d.id).innerHTML = ''
+          }
          box.append('circle')
            .attr('r', d.radius)
            .attr('fill', d.color)
@@ -670,11 +698,63 @@ export default {
    },
    upDate () {

+    },
+    graphIconEnter (item) {
+      const svg = d3.select('#svgHex' + this.chartId)
+      const node = svg.selectAll('.node')
+      const linkCopy = svg.selectAll('line')
+      node.transition().attr('style', function (d) {
+        let str = 'opacity:'
+        if (d.type === item.type) {
+          str += 1
+        } else {
+          str += 0.05
+        }
+        return str + ';cursor:pointer'
+      }).duration(300)
+      linkCopy.transition().attr('style', function (d) {
+        let str = 'opacity:'
+        str += 0.05
+        return str + ';cursor:pointer'
+      }).duration(300)
+    },
+    graphIconLeave (item) {
+      const svg = d3.select('#svgHex' + this.chartId)
+      const node = svg.selectAll('.node')
+      const linkCopy = svg.selectAll('line')
+      node.transition().attr('style', function (d) {
+        let str = 'opacity:'
+        str += 1
+        return str + ';cursor:pointer'
+      }).duration(300)
+      linkCopy.transition().attr('style', function (d) {
+        let str = 'opacity:'
+        str += 1
+        return str + ';cursor:pointer'
+      }).duration(300)
+    }
+  },
+  watch: {
+    'data.nodes': {
+      handler (n) {
+        this.graphIconArr = []
+        this.data.nodes.forEach(item => {
+          if (this.graphIconArr.indexOf(item.type) === -1) {
+            this.graphIconArr.push(item.type)
+          }
+        })
+        this.graphIconArr = this.graphIconArr.map(item => {
+          return this.nzIcon.find(nzIcon => nzIcon.type === item)
+        })
+      },
+      // deep: true,
+      immediate: true
    }
  },
  created () {
  },
  mounted () {
+
  },
  beforeDestroy () {
  }
--- a/nezha-fronted/src/components/chart/chart/grid/GridItem.vue
+++ b/nezha-fronted/src/components/chart/chart/grid/GridItem.vue
@@ -182,6 +182,11 @@ export default {
    i: {
      required: true
    },
+    isGroup: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
    dragIgnoreFrom: {
      type: String,
      required: false,
@@ -699,12 +704,16 @@ export default {
      // (l - m) / (c + m) = x
      // x = (left - margin) / (coldWidth + margin)
      let x = Math.round((left - this.margin[0]) / (colWidth + this.margin[0]))
-      let y = (top - this.margin[1]) / (this.rowHeight + this.margin[1])

+      let y = ''
+      if (this.isGroup) {
+        y = Math.round((top - this.margin[1]) / (this.rowHeight + this.margin[1]))
+      } else {
+        y = (top - this.margin[1]) / (this.rowHeight + this.margin[1])
+      }
      // Capping
      x = Math.max(Math.min(x, this.cols - this.innerW), 0)
      y = Math.max(Math.min(y, this.maxRows - this.innerH), 0)
-
      return { x, y }
    },
    // Helper for generating column width
--- a/nezha-fronted/src/components/chart/chart/line-chart-block.vue
+++ b/nezha-fronted/src/components/chart/chart/line-chart-block.vue
@@ -56,11 +56,11 @@
            </span>
            <ul slot="dropdown" v-show="dropdownMenuShow"  :id="'dropdownUl'+chartIndex"  class="el-dropdown-menu nz-chart-dropdown"  style="" >
              <li  @click="editChart" class="el-dropdown-menu__item">
-                <i class="nz-icon nz-icon-edit" style="font-size: 16px;"></i><span>{{$t('dashboard.edit')}}</span></li>
+                <i class="nz-icon nz-icon-edit" style="font-size: 16px;"></i><span>{{$t('overall.edit')}}</span></li>
              <li  v-has="'main_delete'" class="el-dropdown-menu__item" @click="removeChart">
-                <i class="nz-icon nz-icon-delete" style="font-size: 16px;"></i>{{$t('dashboard.delete')}}</li>
+                <i class="nz-icon nz-icon-delete" style="font-size: 16px;"></i>{{$t('overall.delete')}}</li>
              <li  v-has="'main_add'" class="el-dropdown-menu__item" @click="duplicate">
-                <i class="el-icon-copy-document" style="font-size: 16px;"></i>{{$t('dashboard.duplicate')}}</li>
+                <i class="el-icon-copy-document" style="font-size: 16px;"></i>{{$t('overall.duplicate')}}</li>
              <li  v-has="'main_edit'"  v-if="from !== 'chartTemp'&&chartData.pid" class="el-dropdown-menu__item" @click="$emit('sync')">
                <i class="nz-icon nz-icon-sync" style="font-size: 16px;"></i>{{$t('overall.syncChart')}}</li>
            </ul>
@@ -110,7 +110,7 @@
        <!--
        <Modal title="查看" v-model="screenModal" width="96%" class="line-chart-block-modal">-->
        <el-dialog class="line-chart-block-modal nz-dialog"
-                   :title="$t('dashboard.panel.view')"
+                   :title="$t('overall.view')"
                   :visible.sync="screenModal"
                   width="90%"
                   @close="screenModal = false;screenLegendListMore=[]"
--- a/nezha-fronted/src/components/chart/chartDetail.vue
+++ b/nezha-fronted/src/components/chart/chartDetail.vue
@@ -17,7 +17,7 @@
            <div class="basic-info-table-value">{{chartDetail? chartDetail.name : '--' }}</div>
          </div>
          <div class="basic-info-table-list">
-            <div class="basic-info-table-title">{{$t('overall.manageIp')}}</div>
+            <div class="basic-info-table-title">{{$t('asset.manageIp')}}</div>
            <div class="basic-info-table-value">{{chartDetail ? chartDetail.manageIp : '--'}}</div>
          </div>
          <div class="basic-info-table-list">
@@ -40,15 +40,15 @@
            <div class="basic-info-table-value">{{chartDetail.dc ? chartDetail.dc.name : '--'}}</div>
          </div>
          <div class="basic-info-table-list">
-            <div class="basic-info-table-title">{{$t('overall.cabinet')}}</div>
+            <div class="basic-info-table-title">{{$t('asset.cabinet')}}</div>
            <div class="basic-info-table-value">{{chartDetail.cabinet ? chartDetail.cabinet.name : '--'}}</div>
          </div>
          <div class="basic-info-table-list">
-            <div class="basic-info-table-title">{{$t('overall.brand')}}</div>
+            <div class="basic-info-table-title">{{$t('asset.brand')}}</div>
            <div class="basic-info-table-value">{{chartDetail.brand ? chartDetail.brand.name : '--'}}</div>
          </div>
          <div class="basic-info-table-list">
-            <div class="basic-info-table-title">{{$t('overall.model')}}</div>
+            <div class="basic-info-table-title">{{$t('asset.model')}}</div>
            <div class="basic-info-table-value">{{chartDetail.model ? chartDetail.model.name : '--'}}</div>
          </div>
          <div class="basic-info-table-list">
@@ -68,7 +68,7 @@
            <div class="basic-info-table-value" v-if="chartDetail">
              <i :class="chartDetail.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
              <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-                <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+                <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
                <div class="severity-info" style='justify-content: space-between'>
                  <div class="severity-name">{{$t('overall.result.total')}}</div>
                  <div class="severity-value">{{chartDetail.alertNum}}</div>
@@ -118,7 +118,7 @@
            <div class="basic-info-table-value" v-if="chartDetail">
              <i :class="chartDetail.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
              <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-                <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+                <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
                <div class="severity-info" style='justify-content: space-between'>
                  <div class="severity-name">{{$t('overall.result.total')}}</div>
                  <div class="severity-value">{{chartDetail.alertNum}}</div>
@@ -131,7 +131,7 @@
            <div class="basic-info-table-title">{{$t('overall.state')}}</div>
            <div class="basic-info-table-value">
              <span style="width: auto">
-              <span class="endpoint-cell-left"><i class="nz-icon nz-icon-Metrics active" /> {{$t('project.endpoint.metrics')}} </span>
+              <span class="endpoint-cell-left"><i class="nz-icon nz-icon-Metrics active" /> {{$t('overall.metric')}} </span>
              <span v-if="chartDetail && chartDetail.configs[0].state === 0">
                <span class="active-icon red-bg inline-block"></span>
              </span>
@@ -143,7 +143,7 @@
              </span>
            </span>
              <span style="width: auto">
-                <span class="endpoint-cell-left" style="margin-left: 10px"><i class="nz-icon nz-icon-logs active" /> {{$t('project.endpoint.logs')}} </span>
+                <span class="endpoint-cell-left" style="margin-left: 10px"><i class="nz-icon nz-icon-logs active" /> {{$t('overall.logs')}} </span>
                <span v-if="chartDetail && chartDetail.configs[1].state === 0">
                  <span class="active-icon red-bg inline-block"></span>
                </span>
@@ -210,6 +210,7 @@ export default {
      this.showBasicInfo = !this.showBasicInfo
    },
    init () {
+      if (window.dataJson) { return }
      this.loading = true
      const weekDays = this.getWeeksTime()
      if (this.trendTimer) {
--- a/nezha-fronted/src/components/chart/chartHeader.vue
+++ b/nezha-fronted/src/components/chart/chartHeader.vue
@@ -43,7 +43,7 @@
        </el-tooltip>
      </span>
      <span  v-if="chartInfo.type=='group'" class="chart-header__tool" @click="addChartGroup">
-        <el-tooltip :content="$t('overall.add')" effect="light" placement="top">
+        <el-tooltip :content="$t('button.add')" effect="light" placement="top">
           <i class="nz-icon nz-icon-plus tool__icon"></i>
        </el-tooltip>
      </span>
@@ -64,15 +64,15 @@
          <ul v-show="dropdownMenuShow" slot="dropdown" class="el-dropdown-menu nz-chart-dropdown">
            <li class="el-dropdown-menu__item" v-has="'main_edit'" @click="editChart">
              <i class="nz-icon nz-icon-edit" style="font-size: 16px;"></i>
-              <span>{{$t('dashboard.edit')}}</span>
+              <span>{{$t('overall.edit')}}</span>
            </li>
            <li v-has="'main_delete'" class="el-dropdown-menu__item" @click="removeChart">
              <i class="nz-icon nz-icon-delete" style="font-size: 16px;"></i>
-              <span>{{$t('dashboard.delete')}}</span>
+              <span>{{$t('overall.delete')}}</span>
            </li>
            <li v-has="'main_add'" class="el-dropdown-menu__item" @click="duplicate">
              <i class="el-icon-copy-document" style="font-size: 16px;"></i>
-              <span>{{$t('dashboard.duplicate')}}</span>
+              <span>{{$t('overall.duplicate')}}</span>
            </li>
            <li v-if="from !== this.$CONSTANTS.fromRoute.chartTemp && chartInfo.pid" v-has="'main_edit'" class="el-dropdown-menu__item" @click="sync">
              <i class="nz-icon nz-icon-sync" style="font-size: 16px;"></i>
--- a/nezha-fronted/src/components/chart/chartList.vue
+++ b/nezha-fronted/src/components/chart/chartList.vue
@@ -28,6 +28,7 @@
        :min-h="headerH"
        :max-h="12"
        :static="item.static"
+        :isGroup="isGroup"
        :class="{
          'group-hide-header':item.type === 'group' && item.param.collapse,
          'opacityItem': item.static
@@ -358,7 +359,10 @@ export default {
          this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].groupShow(item.param.collapse)
          this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].$refs.chart && this.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id] && this.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id].$refs.chartList.resize()
        }
-        this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].resize()
+        try {
+          this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].resize()
+        } catch (error) {
+        }
      })
    },
    refreshPanel () {
@@ -444,6 +448,15 @@ export default {
    window.removeEventListener('resize', this.resize)
  },
  watch: {
+    // 监听查看模式变化
+    '$store.state.panel.mode': {
+      immediate: true,
+      handler (val) {
+        setTimeout(() => {
+          this.resize()
+        }, 100)
+      }
+    },
    dataList: {
      immediate: true,
      deep: true,
--- a/nezha-fronted/src/components/chart/chartMixin.js
+++ b/nezha-fronted/src/components/chart/chartMixin.js
@@ -1,4 +1,5 @@
 import lodash from 'lodash'
+import * as echarts from 'echarts'
 import { getMetricTypeValue } from '@/components/common/js/tools'
 import { getChart, getMousePoint, setChart } from '@/components/common/js/common'
 import { randomcolor } from '@/components/common/js/radomcolor/randomcolor'
@@ -40,6 +41,20 @@ export default {
    }
  },
  methods: {
+    // 十六进制转为rgba
+    hexToRgb (hex, a = 1) {
+      /*
+        hex: {String}, "#333", "#AF0382"
+      */
+      hex = hex.slice(1)
+      if (hex.length == 3) {
+        hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2]
+      }
+      const r = parseInt(hex.slice(0, 2), 16)
+      const g = parseInt(hex.slice(2, 4), 16)
+      const b = parseInt(hex.slice(4, 6), 16)
+      return `rgba(${r}, ${g}, ${b}, ${a})`
+    },
    handleTimeSeries (chartInfo, seriesTemplate, originalDatas) {
      const series = []
      let colorIndex = 0
@@ -74,6 +89,21 @@ export default {
                }
              })
            }
+            // 判断如果是面积图 颜色设为渐变色
+            if (s.areaStyle && this.colorList.length) {
+              s.areaStyle = {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    color: this.hexToRgb(this.colorList[colorIndex], 0.1)
+                  },
+                  {
+                    offset: 1,
+                    color: this.hexToRgb(this.colorList[colorIndex], 1)
+                  }
+                ])
+              }
+            }
            series.push(s)
            colorIndex++
          }
--- a/nezha-fronted/src/components/chart/panelChart.vue
+++ b/nezha-fronted/src/components/chart/panelChart.vue
@@ -435,10 +435,16 @@ export default {
            break
          }
          case 'system': {
+            this.chartInfo.elements = this.chartInfo.param.datasource
            this.chartData = []
+            if (this.chartInfo.type === 'assetInfo' || this.chartInfo.type === 'endpointInfo') {
+              this.chartData = this.dataJson[this.chartInfo.id + '_' + 0].data
+              this.loading = false
+              break
+            }
            this.chartData.push(this.dataJson[this.chartInfo.id + '_' + 0].result)
-          }
            break
+          }
          case 'misc': {
            this.loading = false
            setTimeout(() => {
@@ -576,6 +582,9 @@ export default {
      this.$emit('showFullscreen', show, this.chartInfo)
    },
    groupShow (flag) {
+      if (this.chartInfo.type === 'group' && !flag) {
+        this.chartData = lodash.get(this, 'chartInfo.children', [])
+      }
      this.chartInfo.param.collapse = flag
      this.groupInit()
      bus.$emit('groupMove', '', '', true)
--- a/nezha-fronted/src/components/cli/webSSH.vue
+++ b/nezha-fronted/src/components/cli/webSSH.vue
@@ -95,7 +95,7 @@
          <div class="footer" slot="footer">
            <div class="el-message-box__btns" style="text-align: right;margin-top: 20px;">
              <button  @click="upload"  class="el-button el-button--default el-button--small">
-                <span>{{$t('webshell.uploadButtonTitle')}}</span>
+                <span>{{$t('overall.upload')}}</span>
              </button>
              <button @click="closeDialog"  class="el-button el-button--default el-button--small" >
                <span>{{$t('overall.cancel')}}</span>
@@ -119,7 +119,7 @@
          <div class="footer" slot="footer">
            <div class="el-message-box__btns" style="text-align: right;margin-top: 20px;">
              <button @click="download"  class="el-button el-button--default el-button--small">
-                <span>{{$t('webshell.downloadButtonTitle')}}</span>
+                <span>{{$t('overall.download')}}</span>
              </button>
              <button  @click="closeDownloadDialog"  class="el-button el-button--default el-button--small">
                <span>{{$t('overall.cancel')}}</span>
@@ -198,28 +198,28 @@
                <el-option v-for="item in authProtocol" :id="'dc-principal-op-'+item.value" :key="item.value" :label="item.name" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
-            <el-form-item :label='$t("webshell.authType")' prop="authType"  @change="authTypeChange" >
+            <el-form-item :label='$t("asset.authType")' prop="authType"  @change="authTypeChange" >
              <el-select value-key="id" popper-class="config-dropdown w260 right-box-select-top right-public-box-dropdown-top" v-model="customConnect.authType" :disabled="customConnect.authProtocol === 2" placeholder="" size="small" id="webshell-box-input-protocol">
                <el-option v-for="item in authType" :id="'dc-principal-op-'+item.value" :key="item.value" :label="item.name" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
-            <el-form-item :label='$t("webshell.host")' prop="host">
+            <el-form-item :label='$t("asset.host")' prop="host">
              <el-input v-model="customConnect.host" size="small"/>
            </el-form-item>
-            <el-form-item :label='$t("webshell.port")' prop="port">
+            <el-form-item :label='$t("asset.port")' prop="port">
              <el-input v-model="customConnect.port" size="small"/>
            </el-form-item>
-            <el-form-item :label='$t("webshell.authUsername")' prop="authUsername">
+            <el-form-item :label='$t("profile.username")' prop="authUsername">
              <el-input v-model="customConnect.authUsername" size="small" autocomplete="new-password"/>
            </el-form-item>
            <el-form-item
              v-if="customConnect.authType === 2"
-              :label='$t("webshell.authPriKey")'
+              :label='$t("asset.talon.token")'
              prop="authPriKey"
            >
              <el-input v-model="customConnect.authPriKey" size="small" autocomplete="new-password"/>
            </el-form-item>
-            <el-form-item :label='$t("webshell.authPin")' prop="authPin"
+            <el-form-item :label='$t("login.pin")' prop="authPin"
                          :rules="[
                  { required: customConnect.authType ===1, message:$t('validate.required'), trigger: 'change'},
                ]">
@@ -227,13 +227,13 @@
            </el-form-item>
            <el-form-item
              v-if="customConnect.authProtocol === 2"
-              :label='$t("webshell.authUserTip")'
+              :label='$t("asset.usernamePrompt")'
              prop="authUserTip">
              <el-input v-model="customConnect.authUserTip" size="small"/>
            </el-form-item>
            <el-form-item
              v-if="customConnect.authProtocol === 2"
-              :label='$t("webshell.authPinTip")'
+              :label='$t("asset.pinPrompt")'
              prop="authPinTip"
            >
              <el-input v-model="customConnect.authPinTip" size="small"/>
@@ -318,11 +318,11 @@ export default {
      // upoload-download

      currentUuid: '',
-      uploadBox: { showUpload: false, title: this.$t('webshell.uploadTitle') },
+      uploadBox: { showUpload: false, title: this.$t('overall.upload') },
      uploadFile: { file: '', path: '', uuid: '' },
      uploadFileList: [],
      uploadResult: null,
-      downloadBox: { showDownload: false, title: this.$t('webshell.downloadTitle') },
+      downloadBox: { showDownload: false, title: this.$t('overall.download') },
      downloadFile: { path: '', uuid: '' },
      downloadFileList: [],
      downloadResult: null,
--- a/nezha-fronted/src/components/common/ChartDiagram/diagram.vue
+++ b/nezha-fronted/src/components/common/ChartDiagram/diagram.vue
@@ -102,7 +102,7 @@
          <button type="button" @click="previewTopology" v-if="!isPreview" class="nz-btn nz-btn-size-normal nz-btn-style-light"
                  style="margin-right: 20px"
          >
-             {{$t('project.topology.preview')}}
+             {{$t('overall.preview')}}
           </button>
            <button type="button" v-if="isPreview" class="nz-btn nz-btn-size-normal nz-btn-style-light" @click="previewExit"
                    style="margin-right: 20px"
@@ -113,7 +113,7 @@
                   :disabled="prevent_opt.save"
                   :class="{'nz-btn-disabled':prevent_opt.save}"
                   style="margin-right: 20px">
-             {{$t('project.topology.save')}}
+             {{$t('overall.save')}}
           </button>
           <button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal" style="margin-right: 20px" @click="cancelTopology">
             {{$t('project.topology.exit')}}
@@ -122,7 +122,7 @@
        </div>
        <div v-if="(!editTopologyFlag&&!fromOverView)&&!fromChart" class="top-tools" style="padding-left: 10px">
        </div>
-        <div class="nz-table2" :class="fromChart ? 'h100': ''">
+        <div class="nz-table-list" :class="fromChart ? 'h100': ''">
          <!--悬浮network部分-->
          <div class="network-info">
            <div v-if="popDataShow.main">
@@ -302,7 +302,7 @@
                      v-has="'topo_icon_save'" :disabled="prevent_opt.save"
                      :class="{'nz-btn-disabled':prevent_opt.save}"
                      style="margin-right: 20px">
-             {{$t('project.topology.save')}}
+             {{$t('overall.save')}}
           </button>
            </span>
      </div>
@@ -327,7 +327,7 @@ import {
  myCubec,
  myCubeAnchors
 } from '../project/L5/services/canvas.js'
-import {getTopology, getTopologyImg, setTopology, setTopologyImg} from '../js/common'
+import {getTopology, setTopology} from '../js/common'
 import CanvasProps from '../project/L5/CanvasProps'
 import topologyTopTool from '../project/L5/topologyTopTool'
 import popDataMain from '../project/popData/Main'
@@ -355,7 +355,7 @@ export default {
  name: 'diagram',
  data () {
    return {
-      title: this.$t('overall.customPicture'),
+      title: this.$t('overall.uploadCustomPicture'),
      objChange: false, // project 变化 用于判断 init是否执行完成 执行完成 才可以执行下次变化
      chartDataInfo: {},
      topoPrevData: {}, // 预览数据
@@ -491,7 +491,7 @@ export default {
          id: 'endpoint',
          title: this.$t('project.topology.endpoint')
        },
-        { top: '-40px', left: '19px', className: 'nz-icon-asset', id: 'asset', title: this.$t('project.topology.asset') },
+        { top: '-40px', left: '19px', className: 'nz-icon-asset', id: 'asset', title: this.$t('asset.asset') },
        { top: '-4px', left: '40px', className: '', id: 'other', title: '' },
        { top: '30px', left: '19px', className: '', id: 'other', title: '' },
        { top: '30px', left: '-21px', className: 'nz-icon-info-normal', id: 'info', title: this.$t('project.topology.info') },
@@ -1744,7 +1744,7 @@ export default {
          res.data.list.forEach((item, index) => {
            item.imageName = item.name
            delete item.name
-            const nowImage = getTopologyImg(item.id) ? JSON.parse(getTopologyImg(item.id)) : ''
+            const nowImage = ''
            if (nowImage && nowImage.data) {
              promiseArr.push(nowImage)
            } else {
@@ -1756,14 +1756,6 @@ export default {
            this.iconArray = [...res.data.list]
            this.iconArray.forEach((item, index) => {
              item.image = res2[index].data
-              const nowImage = getTopologyImg(item.id) ? JSON.parse(getTopologyImg(item.id)) : ''
-              if (!nowImage || (nowImage && !nowImage.data)) {
-                setTopologyImg(item.id, JSON.stringify({
-                  data: res2[index].data,
-                  width: res2[index].width,
-                  height: res2[index].height
-                }))
-              }
              const group = this.tools.find(tool => tool.group === item.unit)
              if (group) {
                group.children.push({
@@ -1814,7 +1806,7 @@ export default {
          }
          imgidList.forEach((item, index) => {
            if (item.data.imageId && imageAllId.data.list.find(image => item.data.imageId === image.id)) {
-              const nowImage = getTopologyImg(item.data.imageId) ? JSON.parse(getTopologyImg(item.data.imageId)) : ''
+              const nowImage = ''
              if (nowImage && nowImage.data) {
                promiseArr.push(nowImage)
              } else {
@@ -1835,14 +1827,6 @@ export default {
            this.iconArray.forEach((item, index) => {
              if (item.id) {
                item.image = res2[index].data
-                const nowImage = getTopologyImg(item.id) ? JSON.parse(getTopologyImg(item.id)) : ''
-                if (!nowImage || (nowImage && !nowImage.image)) {
-                  setTopologyImg(item.id, JSON.stringify({
-                    data: res2[index].data,
-                    width: res2[index].width,
-                    height: res2[index].height
-                  }))
-                }
              }
            })
            this.imgInit = true
--- a/nezha-fronted/src/components/common/alert/alertLabel.vue
+++ b/nezha-fronted/src/components/common/alert/alertLabel.vue
@@ -57,7 +57,7 @@
        </div>
      </div> -->
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.manageIp") }}</div>
+        <div class="alert-label-title">{{ $t("asset.manageIp") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.manageIp
@@ -123,7 +123,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.cabinet") }}</div>
+        <div class="alert-label-title">{{ $t("asset.cabinet") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData &&
@@ -135,7 +135,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.brand") }}</div>
+        <div class="alert-label-title">{{ $t("asset.brand") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.brand && alertLabelData.brand.name
@@ -145,7 +145,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.model") }}</div>
+        <div class="alert-label-title">{{ $t("asset.model") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.model && alertLabelData.model.name
@@ -169,7 +169,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -263,7 +263,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -358,7 +358,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -457,7 +457,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -476,7 +476,7 @@
          <span style="width: auto">
            <span class="endpoint-cell-left"
              ><i class="nz-icon nz-icon-Metrics active" />
-              {{ $t("project.endpoint.metrics") }}
+              {{ $t("overall.metric") }}
            </span>
            <span
              v-if="alertLabelData && alertLabelData.configs[0].state === 0"
@@ -497,7 +497,7 @@
          <span style="width: auto">
            <span class="endpoint-cell-left" style="margin-left: 10px"
              ><i class="nz-icon nz-icon-logs active" />
-              {{ $t("project.endpoint.logs") }}
+              {{ $t("overall.logs") }}
            </span>
            <span
              v-if="alertLabelData && alertLabelData.configs[1].state === 0"
@@ -533,7 +533,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.location") }}</div>
+        <div class="alert-label-title">{{ $t("asset.location") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.location && alertLabelData.location
@@ -543,7 +543,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.cabinet") }}</div>
+        <div class="alert-label-title">{{ $t("asset.cabinet") }}</div>
        <div class="alert-label-value">
          <i
            v-if="alertLabelData"
@@ -589,7 +589,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
--- a/nezha-fronted/src/components/common/alert/alertLabel2.vue
+++ b/nezha-fronted/src/components/common/alert/alertLabel2.vue
@@ -17,7 +17,7 @@
        <div class="alert-label-value">{{alertLabelData && alertLabelData.name ? alertLabelData.name : '--'}}</div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{$t('overall.manageIp')}}</div>
+        <div class="alert-label-title">{{$t('asset.manageIp')}}</div>
        <div class="alert-label-value">{{alertLabelData && alertLabelData.manageIp ? alertLabelData.manageIp : '--'}}</div>
      </div>
      <div class="alert-label-box">
@@ -40,15 +40,15 @@
        <div class="alert-label-value">{{alertLabelData && alertLabelData.dc && alertLabelData.dc.name ? alertLabelData.dc.name:'--'}}</div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{$t('overall.cabinet')}}</div>
+        <div class="alert-label-title">{{$t('asset.cabinet')}}</div>
        <div class="alert-label-value">{{alertLabelData && alertLabelData.cabinet && alertLabelData.cabinet.name ? alertLabelData.cabinet.name : '--'}}</div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{$t('overall.brand')}}</div>
+        <div class="alert-label-title">{{$t('asset.brand')}}</div>
        <div class="alert-label-value">{{alertLabelData && alertLabelData.brand && alertLabelData.brand.name ? alertLabelData.brand.name : '--'}}</div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{$t('overall.model')}}</div>
+        <div class="alert-label-title">{{$t('asset.model')}}</div>
        <div class="alert-label-value">{{alertLabelData && alertLabelData.model && alertLabelData.model.name ? alertLabelData.model.name : '--'}}</div>
      </div>
      <div class="alert-label-box">
@@ -56,7 +56,7 @@
        <div class="alert-label-value" v-if="alertLabelData">
          <i :class="alertLabelData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
            <div class="severity-info" style='justify-content: space-between'>
              <div class="severity-name">{{$t('overall.result.total')}}</div>
              <div class="severity-value">{{alertLabelData.alertNum}}</div>
@@ -107,7 +107,7 @@
        <div class="alert-label-value" v-if="alertLabelData">
          <i :class="alertLabelData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
            <div class="severity-info" style='justify-content: space-between'>
              <div class="severity-name">{{$t('overall.result.total')}}</div>
              <div class="severity-value">{{alertLabelData.alertNum}}</div>
@@ -158,7 +158,7 @@
        <div class="alert-label-value" v-if="alertLabelData">
          <i :class="alertLabelData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
            <div class="severity-info" style='justify-content: space-between'>
              <div class="severity-name">{{$t('overall.result.total')}}</div>
              <div class="severity-value">{{alertLabelData.alertNum}}</div>
@@ -208,7 +208,7 @@
        <div class="alert-label-value" v-if="alertLabelData">
          <i :class="alertLabelData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
            <div class="severity-info" style='justify-content: space-between'>
              <div class="severity-name">{{$t('overall.result.total')}}</div>
              <div class="severity-value">{{alertLabelData.alertNum}}</div>
@@ -224,7 +224,7 @@
        <div class="alert-label-title">{{$t('overall.state')}}</div>
        <div class="alert-label-value">
           <span style="width: auto">
-            <span class="endpoint-cell-left"><i class="nz-icon nz-icon-Metrics colorFA901C" /> {{$t('project.endpoint.metrics')}} </span>
+            <span class="endpoint-cell-left"><i class="nz-icon nz-icon-Metrics colorFA901C" /> {{$t('overall.metric')}} </span>
            <span v-if="alertLabelData && alertLabelData.configs[0].state === 0">
              <span class="active-icon red-bg inline-block"></span>
            </span>
@@ -236,7 +236,7 @@
            </span>
          </span>
          <span style="width: auto">
-            <span class="endpoint-cell-left" style="margin-left: 10px"><i class="nz-icon nz-icon-logs colorFA901C" /> {{$t('project.endpoint.logs')}} </span>
+            <span class="endpoint-cell-left" style="margin-left: 10px"><i class="nz-icon nz-icon-logs colorFA901C" /> {{$t('overall.logs')}} </span>
            <span v-if="alertLabelData && alertLabelData.configs[1].state === 0">
              <span class="active-icon red-bg inline-block"></span>
            </span>
@@ -261,11 +261,11 @@
        <div class="alert-label-value">{{alertLabelData && alertLabelData.name ? alertLabelData.name : '--'}}</div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{$t('overall.location')}}</div>
+        <div class="alert-label-title">{{$t('asset.location')}}</div>
        <div class="alert-label-value">{{alertLabelData && alertLabelData.location && alertLabelData.location ? alertLabelData.location : '--'}}</div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{$t('overall.cabinet')}}</div>
+        <div class="alert-label-title">{{$t('asset.cabinet')}}</div>
        <div class="alert-label-value">
          <i v-if="alertLabelData" class="nz-icon nz-icon-cabinet monitorColor" :class="alertLabelData && alertLabelData.cabinetNum> 0 ? 'color23BF9A' : 'colorEF7458'"/>&nbsp;
          <span>{{alertLabelData && alertLabelData.cabinetNum ? alertLabelData.cabinetNum : 0}}</span></div>
@@ -282,7 +282,7 @@
        <div class="alert-label-value" v-if="alertLabelData">
          <i :class="alertLabelData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
            <div class="severity-info" style='justify-content: space-between'>
              <div class="severity-name">{{$t('overall.result.total')}}</div>
              <div class="severity-value">{{alertLabelData.alertNum}}</div>
--- a/nezha-fronted/src/components/common/alert/alertLabel3.vue
+++ b/nezha-fronted/src/components/common/alert/alertLabel3.vue
@@ -38,7 +38,7 @@
        </div>
      </div> -->
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.manageIp") }}</div>
+        <div class="alert-label-title">{{ $t("asset.manageIp") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.manageIp
@@ -104,7 +104,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.cabinet") }}</div>
+        <div class="alert-label-title">{{ $t("asset.cabinet") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData &&
@@ -116,7 +116,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.brand") }}</div>
+        <div class="alert-label-title">{{ $t("asset.brand") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.brand && alertLabelData.brand.name
@@ -126,7 +126,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.model") }}</div>
+        <div class="alert-label-title">{{ $t("asset.model") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.model && alertLabelData.model.name
@@ -150,7 +150,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -244,7 +244,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -339,7 +339,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -438,7 +438,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
@@ -457,7 +457,7 @@
          <span style="width: auto">
            <span class="endpoint-cell-left"
              ><i class="nz-icon nz-icon-Metrics active" />
-              {{ $t("project.endpoint.metrics") }}
+              {{ $t("overall.metric") }}
            </span>
            <span
              v-if="alertLabelData && alertLabelData.configs[0].state === 0"
@@ -478,7 +478,7 @@
          <span style="width: auto">
            <span class="endpoint-cell-left" style="margin-left: 10px"
              ><i class="nz-icon nz-icon-logs active" />
-              {{ $t("project.endpoint.logs") }}
+              {{ $t("overall.logs") }}
            </span>
            <span
              v-if="alertLabelData && alertLabelData.configs[1].state === 0"
@@ -514,7 +514,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.location") }}</div>
+        <div class="alert-label-title">{{ $t("asset.location") }}</div>
        <div class="alert-label-value">
          {{
            alertLabelData && alertLabelData.location && alertLabelData.location
@@ -524,7 +524,7 @@
        </div>
      </div>
      <div class="alert-label-box">
-        <div class="alert-label-title">{{ $t("overall.cabinet") }}</div>
+        <div class="alert-label-title">{{ $t("asset.cabinet") }}</div>
        <div class="alert-label-value">
          <i
            v-if="alertLabelData"
@@ -570,7 +570,7 @@
            :style="{ left: position.left + 'px', top: position.top + 'px' }"
          >
            <div class="tooltip-title">
-              {{ $t("project.topology.alert") }}({{ $t("asset.pingActive") }})
+              {{ $t("project.topology.alert") }}({{ $t("overall.active") }})
            </div>
            <div class="severity-info" style="justify-content: space-between">
              <div class="severity-name">{{ $t("overall.result.total") }}</div>
--- a/nezha-fronted/src/components/common/alert/alertMessageInfo.vue
+++ b/nezha-fronted/src/components/common/alert/alertMessageInfo.vue
@@ -348,6 +348,10 @@ export default {
    this.chartInfo.loaded && this.getChartData()
    this.showAllData = !this.showMultiple(this.chartInfo.type)
    this.getAlertMessageInfo()
+    window.addEventListener('resize', this.resize)
+  },
+  destroyed() {
+    window.removeEventListener('resize', this.resize)
  }
 }
 </script>
--- a/nezha-fronted/src/components/common/alert/alertMessageInfoDetail.vue
+++ b/nezha-fronted/src/components/common/alert/alertMessageInfoDetail.vue
@@ -52,7 +52,7 @@ export default {
        { key: 'summary', label: this.$t('alert.summary') },
        { key: 'description', label: this.$t('overall.remark') },
        { key: 'labels', label: this.$t('alert.list.labels') },
-        { key: 'startAt', label: this.$t('alert.startAt') }
+        { key: 'startAt', label: this.$t('overall.startTime') }
      ]
    }
  }
--- a/nezha-fronted/src/components/common/alert/alertMessageInfoTab.vue
+++ b/nezha-fronted/src/components/common/alert/alertMessageInfoTab.vue
@@ -84,7 +84,7 @@ export default {
        label: this.$t('overall.asset')
      }, {
        key: 'endpoint',
-        label: this.$t('overall.endpoint')
+        label: this.$t('asset.endpoint')
      }, {
        key: 'module',
        label: this.$t('overall.module')
--- a/nezha-fronted/src/components/common/alert/alertMessageInfoTimeLine.vue
+++ b/nezha-fronted/src/components/common/alert/alertMessageInfoTimeLine.vue
@@ -194,7 +194,7 @@ export default {
        {
          key: "endpoint",
          isSelect: true,
-          label: this.$t("overall.endpoint"),
+          label: this.$t("asset.endpoint"),
        },
        {
          key: "alertrule",
--- a/nezha-fronted/src/components/common/alert/alertRuleInfo.vue
+++ b/nezha-fronted/src/components/common/alert/alertRuleInfo.vue
@@ -1,78 +1,80 @@
 <template>
-  <div :style="calcPosition(that.position,that)" class="alert-label__border alert-label" v-my-loading="loading" ref="alertLabels">
-    <div class="alert-label-header-title">
-      <div class="alert-label-header-circle" :style="`background: ${alertColor}`">
-        <i  class="nz-icon nz-icon-Alertrule"></i>
+  <div :style="calcPosition(that.position,that)" class="alert-label__border alert-label" ref="alertLabels">
+    <div v-my-loading="loading">
+      <div class="alert-label-header-title">
+        <div class="alert-label-header-circle" :style="`background: ${alertColor}`">
+          <i  class="nz-icon nz-icon-Alertrule"></i>
+        </div>
+        <div class="alert-label-header-name">
+          {{alertRuleData && alertRuleData.name ? alertRuleData.name : '--'}}
+        </div>
      </div>
-      <div class="alert-label-header-name">
-        {{alertRuleData && alertRuleData.name ? alertRuleData.name : '--'}}
-      </div>
-    </div>
-    <div class="alert-rule-nfo" >
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">ID</div>
-        <div class="alert-rule-value">{{alertRuleData.id ? alertRuleData.id : '--'}}</div>
-      </div>
-      <div class="alert-rule-box name-labe">
-        <div class="alert-rule-title">{{$t('overall.name')}}</div>
-        <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '--'}}</div>
-      </div>
-<!--      <div class="alert-rule-box">-->
-<!--        <div class="alert-rule-title">{{$t('alert.name')}}</div>-->
-<!--        <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '&#45;&#45;'}}</div>-->
-<!--      </div>-->
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.type')}}</div>
-        <div class="alert-rule-value">
+      <div class="alert-rule-nfo" >
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">ID</div>
+          <div class="alert-rule-value">{{alertRuleData.id ? alertRuleData.id : '--'}}</div>
+        </div>
+        <div class="alert-rule-box name-labe">
+          <div class="alert-rule-title">{{$t('overall.name')}}</div>
+          <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '--'}}</div>
+        </div>
+        <!--      <div class="alert-rule-box">-->
+        <!--        <div class="alert-rule-title">{{$t('overall.name')}}</div>-->
+        <!--        <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '&#45;&#45;'}}</div>-->
+        <!--      </div>-->
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">{{$t('overall.type')}}</div>
+          <div class="alert-rule-value">
          <span v-if="alertRuleData.type === 1">
-            {{$t('project.metrics.metrics')}}
+            {{$t('overall.metric')}}
          </span>
-          <span v-else-if="alertRuleData.type === 2">
+            <span v-else-if="alertRuleData.type === 2">
            {{$t('overall.logs')}}
          </span>
-          <span v-else-if="alertRuleData.type === 3">SNMP trap</span>
-          <span v-else>--</span>
+            <span v-else-if="alertRuleData.type === 3">SNMP trap</span>
+            <span v-else>--</span>
+          </div>
        </div>
-      </div>
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.severity')}}</div>
-        <div class="alert-rule-value"><i class="nz-icon nz-icon-circle" :style="{color:severityColor,'font-size':'12px','margin-right':'5px'}"></i>{{alertRuleData.severityId ? severityData.find(s => alertRuleData.severityId === s.id).name : '--'}}</div>
-      </div>
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.config.expr')}}</div>
-        <div class="alert-rule-value">{{alertRuleData.expr ? (alertRuleData.expr + alertRuleData.operator + formatThreshold(alertRuleData.threshold,alertRuleData.unit)) : '--'}}</div>
-      </div>
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.alertNum')}}</div>
-        <div class="alert-rule-value" v-if="alertRuleData">
-          <i :class="alertRuleData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
-          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
-            <div class="severity-info" style='justify-content: space-between'>
-              <div class="severity-name">{{$t('overall.result.total')}}</div>
-              <div class="severity-value">{{alertRuleData.alertNum}}</div>
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">{{$t('alert.severity')}}</div>
+          <div class="alert-rule-value"><i class="nz-icon nz-icon-circle" :style="{color:severityColor,'font-size':'12px','margin-right':'5px'}"></i>{{alertRuleData.severityId ? severityData.find(s => alertRuleData.severityId === s.id).name : '--'}}</div>
+        </div>
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">{{$t('alert.config.expr')}}</div>
+          <div class="alert-rule-value">{{alertRuleData.expr ? (alertRuleData.expr + alertRuleData.operator + formatThreshold(alertRuleData.threshold,alertRuleData.unit)) : '--'}}</div>
+        </div>
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">{{$t('alert.alertNum')}}</div>
+          <div class="alert-rule-value" v-if="alertRuleData">
+            <i :class="alertRuleData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
+            <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
+              <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
+              <div class="severity-info" style='justify-content: space-between'>
+                <div class="severity-name">{{$t('overall.result.total')}}</div>
+                <div class="severity-value">{{alertRuleData.alertNum}}</div>
+              </div>
            </div>
+            <alertDaysInfo
+              v-show="!trendLoading"
+              :alertDaysData="alertDaysData"
+            />
          </div>
-          <alertDaysInfo
-            v-show="!trendLoading"
-            :alertDaysData="alertDaysData"
-          />
        </div>
-      </div>
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.config.trbShot')}}</div>
-        <div class="alert-rule-value" @click="trbShotShow"><i class="nz-icon nz-icon-guzhangshuju"></i></div>
-      </div>
-      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.state')}}</div>
-        <div class="alert-rule-value" style="margin-left: 3px">
-          <div v-if="alertRuleData.state === 1">
-            <i class="active-icon green-bg inline-block"></i>
-            {{ $t('overall.enabled') }}
-          </div>
-          <div v-else-if="alertRuleData.state === 0">
-            <i class="active-icon gray-bg inline-block"></i>
-            {{ $t('overall.disabled') }}
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">{{$t('alert.config.trbShot')}}</div>
+          <div class="alert-rule-value" @click="trbShotShow"><i class="nz-icon nz-icon-guzhangshuju"></i></div>
+        </div>
+        <div class="alert-rule-box">
+          <div class="alert-rule-title">{{$t('overall.state')}}</div>
+          <div class="alert-rule-value" style="margin-left: 3px">
+            <div v-if="alertRuleData.state === 1">
+              <i class="active-icon green-bg inline-block"></i>
+              {{ $t('overall.enabled') }}
+            </div>
+            <div v-else-if="alertRuleData.state === 0">
+              <i class="active-icon gray-bg inline-block"></i>
+              {{ $t('overall.disabled') }}
+            </div>
          </div>
        </div>
      </div>
--- a/nezha-fronted/src/components/common/alert/alertRuleInfo2.vue
+++ b/nezha-fronted/src/components/common/alert/alertRuleInfo2.vue
@@ -18,14 +18,14 @@
        <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '--'}}</div>
      </div>
 <!--      <div class="alert-rule-box">-->
-<!--        <div class="alert-rule-title">{{$t('alert.name')}}</div>-->
+<!--        <div class="alert-rule-title">{{$t('overall.name')}}</div>-->
 <!--        <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '&#45;&#45;'}}</div>-->
 <!--      </div>-->
      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.type')}}</div>
+        <div class="alert-rule-title">{{$t('overall.type')}}</div>
        <div class="alert-rule-value">
          <span v-if="alertRuleData.type === 1">
-            {{$t('project.metrics.metrics')}}
+            {{$t('overall.metric')}}
          </span>
          <span v-else-if="alertRuleData.type === 2">
            {{$t('overall.logs')}}
@@ -47,7 +47,7 @@
        <div class="alert-rule-value" v-if="alertRuleData">
          <i :class="alertRuleData.alertNum ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
          <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+            <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
            <div class="severity-info" style='justify-content: space-between'>
              <div class="severity-name">{{$t('overall.result.total')}}</div>
              <div class="severity-value">{{alertRuleData.alertNum}}</div>
@@ -64,7 +64,7 @@
        <div class="alert-rule-value" @click="trbShotShow"><i class="nz-icon nz-icon-guzhangshuju"></i></div>
      </div>
      <div class="alert-rule-box">
-        <div class="alert-rule-title">{{$t('alert.state')}}</div>
+        <div class="alert-rule-title">{{$t('overall.state')}}</div>
        <div class="alert-rule-value" style="margin-left: 3px">
          <div v-if="alertRuleData.state === 1">
            <i class="active-icon green-bg inline-block"></i>
--- a/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
+++ b/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
@@ -37,7 +37,7 @@
        <operation-log-tab v-if="from === fromRoute.user && targetTab === 'operationLogTab'" :from="from" :obj="obj" :tabs="tabs.user.operationLog" @changeTab="changeTab" :targetTab.sync="targetTab"></operation-log-tab>
        <terminal-log-tab v-if="from === fromRoute.user && targetTab === 'terminalLogTab'" :from="from" :obj="obj" :tabs="tabs.user.terminalLog" @changeTab="changeTab" :targetTab.sync="targetTab"></terminal-log-tab>
        <!-- asset列表的3个 -->
-        <panel-tab-new @getTableData="getTableData" :paramsType="'asset'" v-if="from === fromRoute.asset && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.asset.panel" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
+        <panel-tab-new @exit="closeSubList" @getTableData="getTableData" :paramsType="'asset'" v-if="from === fromRoute.asset && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.asset.panel" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
        <alertMessageTabNew v-if="from === fromRoute.asset && targetTab === 'alertMessageTab'" v-show="subResizeShow" :sign="sign+'alert'" :from="from" :obj="obj" :tabs="tabs.asset.alertMessage" :targetTab.sync="targetTab" @changeTab="changeTab" ></alertMessageTabNew>
        <endpointTabNew v-if="from === fromRoute.asset && targetTab === 'endpointTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.asset.endpoint" :targetTab.sync="targetTab" @changeTab="changeTab"></endpointTabNew>
        <log-bottom-tab v-if="from === fromRoute.asset && targetTab === 'log'" v-show="subResizeShow" :sign="sign+'log'" :from="from" :obj="obj" :tabs="tabs.asset.log" :targetTab.sync="targetTab" @changeTab="changeTab"></log-bottom-tab>
@@ -45,14 +45,14 @@
        <!--module列表的tab-->
        <endpointTabNew v-if="from === fromRoute.module && targetTab === 'endpoint'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab="targetTab" @changeTab="changeTab"></endpointTabNew>
        <alertMessageTabNew v-if="from === fromRoute.module && targetTab === 'moduleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" @changeTab="changeTab" :targetTab="targetTab"></alertMessageTabNew>
-        <panel-tab-new @getTableData="getTableData" :paramsType="'module'" v-if="from === fromRoute.module && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
+        <panel-tab-new @exit="closeSubList" @getTableData="getTableData" :paramsType="'module'" v-if="from === fromRoute.module && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
        <!--endpoint列表的tab-->
-        <panel-tab-new v-if="from === fromRoute.endpoint && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :paramsType="'endpoint'" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab" @getTableData="getTableData"></panel-tab-new>
+        <panel-tab-new @exit="closeSubList" v-if="from === fromRoute.endpoint && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :paramsType="'endpoint'" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab" @getTableData="getTableData"></panel-tab-new>
        <endpointQuery v-if="from === fromRoute.endpoint && targetTab === 'Metrics'"  v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></endpointQuery>
        <log-bottom-tab v-if="from === fromRoute.endpoint && targetTab === 'log' && hasLogConfig" :sign="sign+'log'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></log-bottom-tab>
        <alertMessageTabNew  v-if="from === fromRoute.endpoint && targetTab === 'endpointAlertMessage'" :sign="sign+'alert'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></alertMessageTabNew>
        <!--chartTemp的Tab-->
-        <panel-tab-new @getTableData="getTableData"  :paramsType="'template'" v-if="from === fromRoute.chartTemp && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.chartTemp.chartTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
+        <panel-tab-new @exit="closeSubList" @getTableData="getTableData"  :paramsType="'template'" v-if="from === fromRoute.chartTemp && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.chartTemp.chartTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
        <!--alertRule Tab-->
        <alertMessageTabNew v-if="from === fromRoute.alertRule && targetTab === 'alertRuleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab.sync="targetTab"></alertMessageTabNew>
        <alertRuleEvalLog v-if="from === fromRoute.alertRule && targetTab === 'evalLog'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab.sync="targetTab"></alertRuleEvalLog>
@@ -216,7 +216,7 @@ export default {
          endpointTabTitle: [
            { prop: 'panelTab', name: this.$t('overall.detail') },
            { prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
-            { prop: 'Metrics', name: this.$t('project.metrics.metrics') },
+            { prop: 'Metrics', name: this.$t('overall.metric') },
            { prop: 'log', name: this.$t('overall.logs') }
          ]
        },
@@ -232,22 +232,22 @@ export default {
          ]
        },
        model: [
-          { prop: 'asset', name: this.$t('asset.assets'), active: true }
+          { prop: 'asset', name: this.$t('asset.asset'), active: true }
        ],
        dc: {
          cabinet: [
-            { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: true },
-            { prop: 'asset', name: this.$t('asset.assets'), active: false },
+            { prop: 'cabinet', name: this.$t('asset.cabinet'), active: true },
+            { prop: 'asset', name: this.$t('asset.asset'), active: false },
            { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }
          ],
          asset: [
-            { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: false },
-            { prop: 'asset', name: this.$t('asset.assets'), active: true },
+            { prop: 'cabinet', name: this.$t('asset.cabinet'), active: false },
+            { prop: 'asset', name: this.$t('asset.asset'), active: true },
            { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }
          ],
          alertMessage: [
-            { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: false },
-            { prop: 'asset', name: this.$t('asset.assets'), active: false },
+            { prop: 'cabinet', name: this.$t('asset.cabinet'), active: false },
+            { prop: 'asset', name: this.$t('asset.asset'), active: false },
            { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: true }
          ]
        },
@@ -274,7 +274,7 @@ export default {
      const tabs = [
        { prop: 'panelTab', name: this.$t('overall.detail') },
        { prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
-        { prop: 'Metrics', name: this.$t('project.metrics.metrics') }
+        { prop: 'Metrics', name: this.$t('overall.metric') }
      ]
      if (hasLog) {
        tabs.push({ prop: 'log', name: this.$t('overall.logs') })
--- a/nezha-fronted/src/components/common/bottomBox/nzBottomDataList.vue
+++ b/nezha-fronted/src/components/common/bottomBox/nzBottomDataList.vue
@@ -100,14 +100,14 @@ export default {
      const className = []
      switch (this.targetTab) {
        case 'panelTab':
-          className.push('nz-table2 bottom-panel')
+          className.push('nz-table-list bottom-panel')
          break
        case 'log': {
          className.push('bottom-log')
          break
        }
        default: {
-          className.push('nz-table2')
+          className.push('nz-table-list')
          break
        }
      }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/IpDetails.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/IpDetails.vue
@@ -121,7 +121,7 @@ export default {
          label: 'addr',
          disabled: false
        }, {
-          name: this.$t('asset.state'),
+          name: this.$t('overall.state'),
          type: 'input',
          label: 'state',
          disabled: false
@@ -169,6 +169,7 @@ export default {
      deep: true,
      handler (n, o) {
        if (n) {
+          this.searchLabel = {}
          this.getTableData()
        }
      }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
@@ -3,8 +3,8 @@
    <div class="sub-top-tools">
      <div class="sub-list-tabs" v-if="from===fromRoute.module">
        <div class="sub-list-tab-title">{{obj.name}}</div>
-        <div @click="changeTab('endpoint')" class="sub-list-tab" id="endpoint-tab-change-endpoint">{{$t("asset.modules")}}</div>
-        <div class="sub-list-tab sub-list-tab-active" >{{$t("asset.alerts")}}</div>
+        <div @click="changeTab('endpoint')" class="sub-list-tab" id="endpoint-tab-change-endpoint">{{$t("asset.endpoint")}}</div>
+        <div class="sub-list-tab sub-list-tab-active" >{{$t("alert.alertMessage")}}</div>
      </div>
      <div class="sub-list-tabs" v-else>
        <div class="sub-list-tab-title">
@@ -13,8 +13,8 @@
          <template v-if="from == $CONSTANTS.fromRoute.endpoint"><div class="sub-list-tab-title">{{$t("project.endpoint.endpointId")}}: {{obj ? obj.id : ''}}</div></template>
        </div><div :id="from+'-change-panelordetail'"
        @click="changeTab(from == $CONSTANTS.fromRoute.asset || from == $CONSTANTS.fromRoute.rule || from == $CONSTANTS.fromRoute.endpoint? 'panel' : 'detail')" class="sub-list-tab">{{$t("overall.detail")}}</div><div
-        class="sub-list-tab sub-list-tab-active">{{$t("asset.alerts")}}</div><div v-if="from == $CONSTANTS.fromRoute.asset" :id="from+'-change-modules'"
-        @click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'">{{$t("asset.modules")}}</div>
+        class="sub-list-tab sub-list-tab-active">{{$t("alert.alertMessage")}}</div><div v-if="from == $CONSTANTS.fromRoute.asset" :id="from+'-change-modules'"
+        @click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'">{{$t("asset.endpoint")}}</div>
        <div @click="changeTab('endpointQuery')" class="sub-list-tab" v-has="'project_endpoint_query_chart_view'" v-if="from == $CONSTANTS.fromRoute.endpoint" :id="from+'-change-endpoint'">{{$t("overall.query")}}</div>
      </div>
      <div class="top-tool-right">
@@ -22,7 +22,7 @@
        <div class="top-tool-search">
          <search-input :default-item="'alertMessageState'" :default-value="defaultSearchValue" :searchMsg="searchMsg" @search="search" position="alert-bottom"></search-input>
        </div>
-        <button :title="$t('overall.exportExcelLower')" @click="importBox.show = true" type="button" v-has="['rule_alerts_export', 'project_endpoint_alerts_export', 'asset_alerts_export']"
+        <button :title="$t('overall.exportExcel')" @click="importBox.show = true" type="button" v-has="['rule_alerts_export', 'project_endpoint_alerts_export', 'asset_alerts_export']"
            class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="alert-list-export">
          <i class="nz-icon nz-icon-download1"></i>
        </button>
@@ -49,7 +49,7 @@
      <el-dialog :visible.sync="importBox.show" :title="importBox.title" :modal-append-to-body='false' :show-close="true" width="300px" @close="importBox.show = false" class="nz-dialog">
        <div class="upload-body">
          <button @click="exportCur" class="el-button el-button--default el-button--small">
-            <span>{{$t('overall.exportCur')}}</span>
+            <span>{{$t('overall.current')}}</span>
          </button>
          <button @click="exportAll" class="el-button el-button--default el-button--small">
            <span>{{$t('overall.exportAll')}}</span>
@@ -168,16 +168,16 @@ export default {
          prop: 'description',
          show: true
        }, {
-          label: this.$t('alert.list.state'),
+          label: this.$t('overall.state'),
          prop: 'state',
          show: true,
          width: 100
        }, {
-          label: this.$t('alert.startAt'),
+          label: this.$t('overall.startTime'),
          prop: 'startAt',
          show: true
        }, {
-          label: this.$t('alert.endAt'),
+          label: this.$t('overall.endTime'),
          prop: 'endAt',
          show: true
        }, {
@@ -231,14 +231,14 @@ export default {
          disabled: false
        }, {
          id: 12,
-          name: this.$t('alert.list.state'),
+          name: this.$t('overall.state'),
          type: 'select',
          label: 'alertMessageState',
          disabled: false
        },
        {
          id: 26,
-          name: this.$t('alert.list.id'),
+          name: this.$t('asset.id'),
          type: 'id',
          label: 'id',
          disabled: false
@@ -696,6 +696,7 @@ export default {
      immediate: true,
      deep: true,
      handler (n) {
+        this.searchLabel = {}
        if (this.from === fromRoute.module) {
          this.searchLabel.moduleIds = n.id
        } else {
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
@@ -158,9 +158,11 @@ export default {
      immediate: true,
      handler (n) {
        if (n) {
+          this.searchLabel = {}
          if (this.from === fromRoute.alertSilence) {
            this.state = '2'
          }
+          this.searchLabel = {}
          this.getTableData()
        }
      }
@@ -201,7 +203,7 @@ export default {
        searchLabelList: [
          {
            id: 26,
-            name: this.$t('alert.list.id'),
+            name: this.$t('asset.id'),
            type: 'input',
            label: 'ids',
            disabled: false
--- a/nezha-fronted/src/components/common/bottomBox/tabs/assetSubTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/assetSubTab.vue
@@ -33,6 +33,7 @@
          @addSilence="addSilence"
          @orderBy="tableDataSort"
          @reload="getTableData"
+          @topology="topology"
          @selectionChange="selectionChange"
        ></asset-table>
      </template>
@@ -104,9 +105,10 @@ export default {
          label: 'manageIp',
          disabled: false
        }, {
-          name: this.$t('asset.state'),
+          name: this.$t('overall.state'),
          type: 'assetState',
-          label: 'stateIds',
+          label: 'assetState',
+          id: 'stateIds',
          readonly: true,
          disabled: false
        }]
@@ -279,6 +281,7 @@ export default {
      immediate: true,
      deep: true,
      handler (n, o) {
+        this.searchLabel = {}
        this.searchLabel.dcIds = n.id
        if (this.from === fromRoute.model) {
          delete this.searchLabel.dcIds
--- a/nezha-fronted/src/components/common/bottomBox/tabs/assetTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/assetTab.vue
@@ -32,6 +32,7 @@
          @addSilence="addSilence"
          @orderBy="tableDataSort"
          @reload="getTableData"
+          @topology="topology"
          @selectionChange="selectionChange"
          ></asset-table>
      </template>
@@ -103,9 +104,9 @@ export default {
          label: 'manageIp',
          disabled: false
        }, {
-          name: this.$t('asset.state'),
+          name: this.$t('overall.state'),
          type: 'assetState',
-          label: 'stateIds',
+          label: 'assetState',
          id: 'stateIds',
          readonly: true,
          disabled: false
@@ -283,6 +284,7 @@ export default {
      immediate: true,
      deep: true,
      handler (n, o) {
+        this.searchLabel = {}
        this.searchLabel.dcIds = n.id
        if (this.from === fromRoute.model) {
          delete this.searchLabel.dcIds
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointQuery.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointQuery.vue
@@ -93,6 +93,7 @@ export default {
    obj: {
      immediate: true,
      handler (n) {
+        this.searchLabel = {}
        this.formatTime = bus.timeFormate(new Date(bus.computeTimezoneTime(new Date())))
      }
    }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
@@ -22,7 +22,7 @@
      <div class="sub-list-tabs">
        <div class="sub-list-tab-title">{{$t("project.endpoint.endpointId")}}: {{currentEndpoint ? currentEndpoint.id : ''}}</div><div
        class="sub-list-tab" @click="changeTab('panel')" id="endpoint-query-changepanel">{{$t("overall.detail")}}</div>
-        <div class="sub-list-tab" @click="changeTab('alertMessage')" id="endpoint-query-alertMessage">{{$t("asset.alerts")}}</div>
+        <div class="sub-list-tab" @click="changeTab('alertMessage')" id="endpoint-query-alertMessage">{{$t("alert.alertMessage")}}</div>
        <div class="sub-list-tab sub-list-tab-active">{{$t("overall.query")}}</div>
      </div>
      <div class="top-tool-right">
@@ -64,7 +64,7 @@
      </div>
    </div>
    <div class="table-header-inner" @click="clearSelectedMetrics"><span><i style="font-size: 12px;margin-left: 2px;" class="nz-icon nz-icon-close " :class="{'control-icon-unchecked':selectedEndpoints.length<1,'control-icon-checked':selectedEndpoints.length>0}"></i></span></div>
-     <pl-table :row-height="28" use-virtual :datas="tableData" border :empty-text="$t('config.mib.noData')" :header-cell-class-name="cellClass" :style="{height: $tableHeight.noPagination}"
+     <pl-table :row-height="28" use-virtual :datas="tableData" border :empty-text="$t('overall.noData')" :header-cell-class-name="cellClass" :style="{height: $tableHeight.noPagination}"
               :pagination-show="false" class="nz-table endpoint-query-table" ref="endpointQueryTable" style="width: 100%;" v-my-loading="loading"
               v-if="tableShow && plTableSHow" id="endpoint-list-table" :tooltip-effect="'light'" @selection-change="selectChange">
      <pl-table-column
@@ -80,7 +80,7 @@
        :min-width="1000"
        column-key="element"
        :show-overflow-tooltip="true"
-        :label="$t('project.endpoint.element')">
+        :label="$t('dashboard.panel.chartForm.element')">
        <template v-slot="scope">
          <el-popover trigger="hover" placement="right" v-if="typeof scope.row.metricTip != 'undefined' && scope.row.metricTip != null">
            <div>
@@ -100,7 +100,7 @@
        :resizable="false"
        prop="value"
        column-key="value"
-        :label="$t('project.endpoint.value')"
+        :label="$t('overall.value')"
        min-width="180">
      </pl-table-column>
    </pl-table>
@@ -705,6 +705,7 @@ export default {
      deep: true,
      handler (n) {
        if (n) {
+          this.searchLabel = {}
          this.currentEndpoint = JSON.parse(JSON.stringify(n))
          this.queryEndpoint()
        }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
@@ -4,13 +4,13 @@
      <div class="sub-list-tabs" v-if="from===fromRoute.asset">
        <div class="sub-list-tab-title">{{obj.host}}</div>
        <div class="sub-list-tab" @click="changeTab('panel')" id="endpoint-tab-change-panel">{{$t("overall.detail")}}</div>
-        <div @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'" id="endpoint-tab-change-alertmsg">{{$t("asset.alerts")}}</div>
-        <div class="sub-list-tab sub-list-tab-active">{{$t("asset.modules")}}</div>
+        <div @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'" id="endpoint-tab-change-alertmsg">{{$t("alert.alertMessage")}}</div>
+        <div class="sub-list-tab sub-list-tab-active">{{$t("asset.endpoint")}}</div>
      </div>
      <div class="sub-list-tabs" v-if="from===fromRoute.module">
        <div class="sub-list-tab-title">{{obj.name}}</div>
-        <div class="sub-list-tab sub-list-tab-active">{{$t("asset.modules")}}</div>
-        <div @click="changeTab('alertMessage')" class="sub-list-tab" id="endpoint-tab-change-alertmsg">{{$t("asset.alerts")}}</div>
+        <div class="sub-list-tab sub-list-tab-active">{{$t("asset.endpoint")}}</div>
+        <div @click="changeTab('alertMessage')" class="sub-list-tab" id="endpoint-tab-change-alertmsg">{{$t("alert.alertMessage")}}</div>
      </div>
      <div class="top-tool-right">
        <div class="top-tool-search">
@@ -206,17 +206,17 @@ export default {
          show: true,
          width: '120'
        }, {
-          label: this.$t('project.endpoint.asset'),
+          label: this.$t('asset.asset'),
          prop: 'asset',
          show: true,
          minWidth: '400'
        }, {
-          label: this.$t('project.endpoint.host'),
+          label: this.$t('asset.host'),
          prop: 'host',
          show: true,
          width: 120
        }, {
-          label: this.$t('project.endpoint.port'),
+          label: this.$t('asset.port'),
          prop: 'port',
          show: true,
          width: '120'
@@ -226,27 +226,27 @@ export default {
          show: false,
          width: 120
        }, {
-          label: this.$t('project.endpoint.labels'),
+          label: this.$t('alert.list.labels'),
          prop: 'labels',
          show: true,
          width: 200
        }, {
-          label: this.$t('project.endpoint.param'),
+          label: this.$t('config.assetLabel.params'),
          prop: 'param',
          show: true,
          width: 200
        }, {
-          label: this.$t('project.endpoint.path'),
+          label: this.$t('config.terminallog.path'),
          prop: 'path',
          show: true,
          width: 200
        }, {
-          label: this.$t('alert.list.state'),
+          label: this.$t('overall.state'),
          prop: 'state',
          show: true,
          width: '80'
        }, {
-          label: this.$t('project.endpoint.alerts'),
+          label: this.$t('overall.alert'),
          prop: 'alerts',
          show: true,
          width: 180
@@ -283,7 +283,7 @@ export default {
          disabled: false
        }, {
          id: 33,
-          name: this.$t('asset.state'),
+          name: this.$t('overall.state'),
          // name: this.$t('asset.asset'),
          type: 'select',
          label: 'endpointState',
@@ -499,7 +499,7 @@ export default {
      this.getTableData()
    },
    messageStyle (e) {
-      if (e.column.label == 'Alerts' || e.column.label == this.$t('project.endpoint.alerts')) {
+      if (e.column.label == 'Alerts' || e.column.label == this.$t('overall.alert')) {
        if (e.row.alertNum > 0) {
          return 'danger'
        } else {
@@ -515,6 +515,7 @@ export default {
      deep: true,
      handler (n) {
        if (n) {
+          this.searchLabel = {}
          if (this.from === fromRoute.asset) {
            this.asset = JSON.parse(JSON.stringify(n))
            this.$nextTick(() => {
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTabNew.vue
@@ -33,6 +33,7 @@
          @orderBy="tableDataSort"
          @addSilence="addSilence"
          @reload="getTableData"
+          @topology="topology"
          @selectionChange="selectionChange"
        ></endpoint-table>
      </template>
@@ -74,6 +75,7 @@ export default {
      immediate: true,
      handler (n) {
        if (n) {
+          this.searchLabel = {}
          this.getTableData()
        }
      }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/operationLogTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/operationLogTab.vue
@@ -65,7 +65,7 @@ export default {
        searchLabelList: [
          {
            id: 11,
-            name: this.$t('config.operationlog.type'),
+            name: this.$t('overall.type'),
            type: 'input',
            label: 'type',
            disabled: false
@@ -77,7 +77,7 @@ export default {
            disabled: false
          }, {
            id: 13,
-            name: this.$t('config.operationlog.operation'),
+            name: this.$t('overall.option'),
            type: 'selectString',
            label: 'operation',
            readonly: true,
--- a/nezha-fronted/src/components/common/bottomBox/tabs/panelTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/panelTabNew.vue
@@ -365,6 +365,10 @@ export default {
            if (this.panelDataList.length > 0) {
              this.showPanel.id = this.filter.panelId = 0
              this.getData(this.filter)
+            } else {
+              this.chartListLoading = false
+              this.dataList = this.panelDataList
+              this.$emit('exit')
            }
          })
          this.$emit('getTableData')
@@ -808,6 +812,7 @@ export default {
      handler (n, o) {
        setTimeout(() => {
          if (n && n.id) {
+            this.searchLabel = {}
            this.getTableData(n.id)
            if (this.from === fromRoute.asset) {
              this.searchLabel.assetIds = n.id
--- a/nezha-fronted/src/components/common/bottomBox/tabs/scrapeEndpoint.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/scrapeEndpoint.vue
@@ -88,6 +88,7 @@ export default {
      deep: true,
      handler (n, o) {
        if (n) {
+          this.searchLabel = {}
          this.inputDateSearch = ''
          this.getTableData()
        }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogMonitorTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogMonitorTab.vue
@@ -235,7 +235,7 @@ export default {
      }).then(() => {
        this.$put('/terminal/kill', { uuid: this.obj.uuid }).then(res => {
          if (res.code === 200) {
-            this.$message.success(this.$t('config.terminallog.success'))
+            this.$message.success(this.$t('overall.result.success'))
            this.$emit('exit')
          } else {
            this.$message.error(this.$t('config.terminallog.killErrorTip'))
--- a/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogTab.vue
@@ -84,7 +84,7 @@ export default {
            disabled: false
          }, {
            id: 13,
-            name: this.$t('config.terminallog.sourceIp'),
+            name: this.$t('ping.sourceIp'),
            type: 'input',
            label: 'remoteAddr',
            disabled: false
@@ -102,14 +102,14 @@ export default {
            disabled: false
          }, {
            id: 16,
-            name: this.$t('config.terminallog.protocol'),
+            name: this.$t('webshell.protocol'),
            type: 'selectString',
            label: 'protocol',
            readonly: true,
            disabled: false
          }, {
            id: 17,
-            name: this.$t('config.terminallog.status'),
+            name: this.$t('overall.state'),
            type: 'terminalStatus',
            label: 'state',
            readonly: true,
@@ -164,7 +164,7 @@ export default {
      }).then(() => {
        this.$put('/terminal/kill', { uuid: record.uuid }).then(res => {
          if (res.code === 200) {
-            this.$message.success(this.$t('config.terminallog.success'))
+            this.$message.success(this.$t('overall.result.success'))
            this.bottomBox.showSubList = false
            this.getTableData()
          } else {
--- a/nezha-fronted/src/components/common/deleteButton.vue
+++ b/nezha-fronted/src/components/common/deleteButton.vue
@@ -10,6 +10,7 @@
 </template>

 <script>
+import bus from '@/libs/bus'
 export default {
  name: 'deleteButton',
  props: {
@@ -44,6 +45,7 @@ export default {
          if (response.code === 200) {
            this.$message({ duration: 2000, type: 'success', message: this.$t('tip.deleteSuccess') })
            this.$emit('after')
+            bus.$emit('delTableRow', this.deleteObjs.map(item => item.id))
          } else {
            this.$message.error(response.msg)
          }
--- a/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue
+++ b/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue
@@ -18,7 +18,7 @@
                </span>
                </div>
                <div class="detail-top-search" style="text-align: center" v-else>
-                  {{$t('config.assetLabel.all')}}
+                  {{$t('overall.exportAll')}}
                </div>
                <i class="nz-icon nz-icon-arrow-down search-value"/>
              </div>
@@ -50,7 +50,7 @@
                </span>
                </div>
                <div class="detail-top-search" style="text-align: center" v-else>
-                 {{$t('config.assetLabel.all')}}
+                 {{$t('overall.exportAll')}}
                </div>
                <i class="nz-icon nz-icon-arrow-down search-value"/>
              </div>
--- a/nezha-fronted/src/components/common/detailView/list/alertRule/alertRuleDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/alertRule/alertRuleDetail.vue
@@ -35,7 +35,7 @@
          </div>
          <div class="asset-name">
            <span>{{item.severity?item.severity.name:'-'}} /
-              <span v-if="item.type === 1">{{ $t('project.metrics.metrics') }}</span>
+              <span v-if="item.type === 1">{{ $t('overall.metric') }}</span>
              <span v-else-if="item.type === 2">{{ $t('overall.logs') }}</span>
              <span v-else-if="item.type === 3">SNMP trap</span>
              <span v-else>-</span>
@@ -148,7 +148,7 @@ export default {
          show: false,
          minWidth: 100
        }, {
-          label: this.$t('config.dc.state'),
+          label: this.$t('overall.state'),
          prop: 'state',
          show: true,
          minWidth: 100,
--- a/nezha-fronted/src/components/common/detailView/list/asset/assetDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/asset/assetDetail.vue
@@ -77,12 +77,12 @@ export default {
          minWidth: 140,
          sortable: 'custom'
        }, {
-          label: this.$t('overall.parent'),
+          label: this.$t('asset.parent'),
          prop: 'parent',
          show: false,
          minWidth: 110
        }, {
-          label: this.$t('overall.children'),
+          label: this.$t('overall.assetSubTab'),
          prop: 'children',
          show: false,
          minWidth: 120
@@ -93,7 +93,7 @@ export default {
          minWidth: 140,
          sortable: 'custom'
        }, {
-          label: this.$t('asset.state'),
+          label: this.$t('overall.state'),
          prop: 'state',
          show: true,
          minWidth: 110,
@@ -116,7 +116,7 @@ export default {
          minWidth: 110,
          sortable: 'custom'
        }, {
-          label: this.$t('asset.alertNum'),
+          label: this.$t('overall.alert'),
          prop: 'alertNum',
          show: true,
          width: 120,
--- a/nezha-fronted/src/components/common/detailView/list/dc/dcDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/dc/dcDetail.vue
@@ -77,29 +77,29 @@ export default {
          prop: 'location',
          show: true
        }, {
-          label: this.$t('config.dc.cabinetNum'),
+          label: this.$t('asset.cabinet'),
          prop: 'cabinetNum',
          show: true,
          minWidth: 100,
          sortable: 'custom'
        }, {
-          label: this.$t('config.dc.assets'),
+          label: this.$t('asset.asset'),
          prop: 'assetNum',
          show: true,
          minWidth: 90,
          sortable: 'custom'
        }, {
-          label: this.$t('config.dc.alert'),
+          label: this.$t('overall.alert'),
          prop: 'alertNum',
          width: 120,
          show: true
        }, {
-          label: this.$t('asset.tel'),
+          label: this.$t('config.dc.tel'),
          prop: 'tel',
          show: false,
          minWidth: 100
        }, {
-          label: this.$t('asset.principal'),
+          label: this.$t('config.dc.principal'),
          prop: 'principal',
          show: false,
          minWidth: 120
@@ -114,7 +114,7 @@ export default {
          show: false,
          minWidth: 100
        }, {
-          label: this.$t('config.dc.state'),
+          label: this.$t('overall.state'),
          prop: 'state',
          show: true,
          minWidth: 100,
--- a/nezha-fronted/src/components/common/detailView/list/endpoint/endpointDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/endpoint/endpointDetail.vue
@@ -67,7 +67,7 @@ export default {
          width: 80,
          sortable: 'custom'
        }, {
-          label: this.$t('project.endpoint.name'),
+          label: this.$t('overall.name'),
          prop: 'name',
          show: true,
          minWidth: 200,
@@ -80,7 +80,7 @@ export default {
          sortable: 'custom'
        },
        {
-          label: this.$t('project.endpoint.asset'),
+          label: this.$t('asset.asset'),
          prop: 'asset',
          show: true,
          minWidth: 90,
@@ -92,20 +92,20 @@ export default {
          show: true
        },
        {
-          label: this.$t('project.endpoint.configs'),
+          label: this.$t('project.module.configs'),
          prop: 'configs',
          minWidth: 150,
          show: false
        },
        {
-          label: this.$t('project.endpoint.alerts'),
+          label: this.$t('overall.alert'),
          prop: 'alerts',
          show: true,
          minWidth: 180,
          sortable: 'custom'
        },
        {
-          label: this.$t('project.endpoint.state'),
+          label: this.$t('overall.state'),
          prop: 'state',
          show: true,
          minWidth: 200
--- a/nezha-fronted/src/components/common/detailView/list/module/moduleDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/module/moduleDetail.vue
@@ -67,7 +67,7 @@ export default {
          width: 80,
          sortable: 'custom'
        }, {
-          label: this.$t('project.module.moduleName'),
+          label: this.$t('overall.name'),
          prop: 'name',
          show: true,
          minWidth: 200,
@@ -86,7 +86,7 @@ export default {
          width: 200,
          sortable: 'custom'
        }, {
-          label: this.$t('project.module.alerts'),
+          label: this.$t('overall.alert'),
          prop: 'alertNum',
          show: true,
          width: 120,
--- a/nezha-fronted/src/components/common/detailView/list/terminalLogDetail/terminalLogDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/terminalLogDetail/terminalLogDetail.vue
@@ -92,7 +92,7 @@ export default {
    return {
      tableTitle: [
        {
-          label: this.$t('config.terminallog.id'),
+          label: this.$t('asset.id'),
          prop: 'id',
          show: true,
          width: 80,
@@ -103,13 +103,13 @@ export default {
          minWidth: 200,
          show: true
        }, {
-          label: this.$t('config.terminallog.username'),
+          label: this.$t('config.operationlog.username'),
          prop: 'username',
          minWidth: 200,
          show: true
        },
        {
-          label: this.$t('config.terminallog.source'),
+          label: this.$t('ping.sourceIp'),
          prop: 'sourceIp',
          minWidth: 115,
          show: true,
@@ -121,12 +121,12 @@ export default {
          show: true
        },
        {
-          label: this.$t('config.terminallog.protocol'),
+          label: this.$t('webshell.protocol'),
          prop: 'protocol',
          show: true
        },
        {
-          label: this.$t('config.terminallog.startTime'),
+          label: this.$t('overall.startTime'),
          prop: 'startTime',
          minWidth: 100,
          show: true
@@ -143,7 +143,7 @@ export default {
          show: false
        },
        {
-          label: this.$t('config.terminallog.status'), // killusername鼠标悬停形式
+          label: this.$t('overall.state'), // killusername鼠标悬停形式
          prop: 'state',
          show: true,
          width: 150,
--- a/nezha-fronted/src/components/common/detailView/list/userDetail/userDetail.vue
+++ b/nezha-fronted/src/components/common/detailView/list/userDetail/userDetail.vue
@@ -73,13 +73,13 @@ export default {
          sortable: 'custom'
        },
        // {
-        //   label: this.$t('config.user.username'),
+        //   label: this.$t('login.username'),
        //   prop: 'username',
        //   show: true,
        //   width: 150
        // },
        {
-          label: this.$t('config.user.roles'),
+          label: this.$t('profile.role'),
          prop: 'roles',
          show: true,
          width: 150
@@ -89,17 +89,17 @@ export default {
          show: true,
          minWidth: 150
        }, {
-          label: this.$t('config.user.lastLoginTime'),
+          label: this.$t('profile.lastLoginTime'),
          prop: 'lastLoginTime',
          show: true,
          width: 200
        }, {
-          label: this.$t('config.user.lastLoginIp'),
+          label: this.$t('profile.lastLoginIp'),
          prop: 'lastLoginIp',
          show: true,
          width: 150
        }, {
-          label: this.$t('config.user.source'),
+          label: this.$t('profile.source'),
          prop: 'source',
          show: true,
          width: 150
@@ -109,7 +109,7 @@ export default {
          show: true,
          width: 150
        }, {
-          label: this.$t('config.user.enable'),
+          label: this.$t('overall.enable'),
          prop: 'status',
          show: true,
          width: 100
--- a/nezha-fronted/src/components/common/detailView/view/detailViewRight.vue
+++ b/nezha-fronted/src/components/common/detailView/view/detailViewRight.vue
@@ -200,7 +200,7 @@ export default {
          endpointTabTitle: [
            { prop: 'panelTab', name: this.$t('overall.detail') },
            { prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
-            { prop: 'endpointQuery', name: this.$t('project.metrics.metrics') },
+            { prop: 'endpointQuery', name: this.$t('overall.metric') },
            { prop: 'log', name: this.$t('overall.logs') }
          ]
        },
@@ -216,22 +216,22 @@ export default {
          ]
        },
        model: [
-          { prop: 'asset', name: this.$t('asset.assets'), active: true }
+          { prop: 'asset', name: this.$t('asset.asset'), active: true }
        ],
        dc: {
          cabinet: [
-            { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: true },
-            { prop: 'asset', name: this.$t('asset.assets'), active: false },
+            { prop: 'cabinet', name: this.$t('asset.cabinet'), active: true },
+            { prop: 'asset', name: this.$t('asset.asset'), active: false },
            { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }
          ],
          asset: [
-            { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: false },
-            { prop: 'asset', name: this.$t('asset.assets'), active: true },
+            { prop: 'cabinet', name: this.$t('asset.cabinet'), active: false },
+            { prop: 'asset', name: this.$t('asset.asset'), active: true },
            { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }
          ],
          alertMessage: [
-            { prop: 'cabinet', name: this.$t('config.dc.cabinets'), active: false },
-            { prop: 'asset', name: this.$t('asset.assets'), active: false },
+            { prop: 'cabinet', name: this.$t('asset.cabinet'), active: false },
+            { prop: 'asset', name: this.$t('asset.asset'), active: false },
            { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: true }
          ]
        }
--- a/nezha-fronted/src/components/common/elSelect/MyElSelect.vue
+++ b/nezha-fronted/src/components/common/elSelect/MyElSelect.vue
@@ -210,7 +210,7 @@ export default {
          return this.noMatchText || this.t('el.select.noMatch')
        }
        if (this.options.length === 0) {
-          return this.noDataText || this.t('el.select.noData')
+          return this.noDataText || this.t('overall.noData')
        }
      }
      return null
--- a/nezha-fronted/src/components/common/elementSet.vue
+++ b/nezha-fronted/src/components/common/elementSet.vue
@@ -28,7 +28,7 @@
      </button>
      <div>
        <button :id="tableId+'-element-set-esc'" class="nz-btn nz-btn-size-small nz-btn-style-light" type="button" @click.stop="esc">
-          <span class="top-tool-btn-txt">{{$t('overall.esc')}}</span>
+          <span class="top-tool-btn-txt">{{$t('overall.cancel')}}</span>
        </button>
        <button :id="tableId+'-element-set-save'" class="nz-btn nz-btn-size-small nz-btn-style-normal" type="button" @click.stop="save">
          <span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
--- a/nezha-fronted/src/components/common/exportXLSX.vue
+++ b/nezha-fronted/src/components/common/exportXLSX.vue
@@ -42,7 +42,7 @@
      <div v-if="importBox.type == 2">
        <div class="upload-body">
          <button @click="exportCur"  class="el-button el-button--default el-button--small" :id="id+'-xlsx-export-current'">
-            <span>{{$t('overall.exportCur')}}</span>
+            <span>{{$t('overall.current')}}</span>
          </button>
          <button  @click="exportAll"  class="el-button el-button--default el-button--small" :id="id+'-xlsx-export-all'">
            <span>{{$t('overall.exportAll')}}</span>
--- a/nezha-fronted/src/components/common/filterSearch/filterSearch.vue
+++ b/nezha-fronted/src/components/common/filterSearch/filterSearch.vue
@@ -63,7 +63,7 @@
        </div>
      </template>
    </div>
-    <div class="tag-search__add cursor-pointer" @click="addCondition()">{{$t('project.topology.add')}}</div>
+    <div class="tag-search__add cursor-pointer" @click="addCondition()">{{$t('buttons.add')}}</div>
  </div>
 </template>

--- a/nezha-fronted/src/components/common/globalSearch/globalSearch.vue
+++ b/nezha-fronted/src/components/common/globalSearch/globalSearch.vue
@@ -52,7 +52,7 @@
                    <div class="list-item-sub" v-if="item.sub">
                      {{ item.sub }}
                    </div>
-                    <div class="is-jump" v-my-loading:circle3.scaleMin.icon="true">
+                    <div class="is-jump" v-my-loading:circle3.scaleMin.icon="jumpLoading">
                      <i class="nz-icon nz-icon-huiche"></i>
                    </div>
                  </li>
@@ -163,7 +163,7 @@ export default {
        }, {
          type: 'endpoint',
          isSelect: true,
-          title: this.$t('overall.endpoint')
+          title: this.$t('asset.endpoint')
        }, {
          type: 'alertrule',
          isSelect: true,
--- a/nezha-fronted/src/components/common/globalSearch/searchItemInfo.vue
+++ b/nezha-fronted/src/components/common/globalSearch/searchItemInfo.vue
@@ -12,7 +12,7 @@
        <el-skeleton-item class="search-item-name" search-item-path variant="h3" style="width: 30%" />
        <div v-for="item in skeletonArr" :key="item" class="search-item-info">
          <el-skeleton-item class="search-item-key"/>
-          <el-skeleton-item class="search-item-value-box" style="margin-left: 20px"/>
+          <el-skeleton-item class="search-item-value-box" style="margin-left: 20px;height: 13px"/>
        </div>
      </div>
    </template>
@@ -29,7 +29,7 @@
          </div>
          <div class="search-item-value-box" v-if="obj.type === 'endpoint'&&item.key==='state'&&alertLabelData && alertLabelData.configs">
            <span style="width: auto">
-            <span class="endpoint-cell-left"><i class="nz-icon nz-icon-Metrics active" /> {{$t('project.endpoint.metrics')}} </span>
+            <span class="endpoint-cell-left"><i class="nz-icon nz-icon-Metrics active" /> {{$t('overall.metric')}} </span>
            <span v-if="alertLabelData && alertLabelData.configs[0].state === 0">
              <span class="active-icon red-bg inline-block"></span>
            </span>
@@ -41,7 +41,7 @@
            </span>
          </span>
            <span style="width: auto">
-            <span class="endpoint-cell-left" style="margin-left: 10px"><i class="nz-icon nz-icon-logs active" /> {{$t('project.endpoint.logs')}} </span>
+            <span class="endpoint-cell-left" style="margin-left: 10px"><i class="nz-icon nz-icon-logs active" /> {{$t('overall.logs')}} </span>
            <span v-if="alertLabelData && alertLabelData.configs[1].state === 0">
              <span class="active-icon red-bg inline-block"></span>
            </span>
@@ -66,7 +66,7 @@
          <div style="cursor: pointer" v-else-if="item.key === 'alertNum'">
            <i :class="Number(getPathContent(item.key)) ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert vertical-align-top;"  @mouseenter="tooltipHover('',true, $event)" @mouseleave="tooltipHover('',false, $event)"></i>
            <div v-if="alertNumtooltipShow" class="alert-days-info-tooltip" :style="{left: position.left + 'px',top:position.top + 'px'}">
-              <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('asset.pingActive')}})</div>
+              <div class="tooltip-title">{{$t('project.topology.alert')}}({{$t('overall.active')}})</div>
              <div class="severity-info" style='justify-content: space-between'>
                <div class="severity-name">{{$t('overall.result.total')}}</div>
                <div class="severity-value">{{getPathContent(item.key)}}</div>
@@ -136,7 +136,7 @@ export default {
            label: this.$t('overall.name')
          }, {
            key: 'manageIp',
-            label: this.$t('overall.manageIp')
+            label: this.$t('asset.manageIp')
          }, {
            key: 'type.name',
            label: this.$t('overall.type')
@@ -152,13 +152,13 @@ export default {
            label: this.$t('overall.dc')
          }, {
            key: 'cabinet.name',
-            label: this.$t('overall.cabinet')
+            label: this.$t('asset.cabinet')
          }, {
            key: 'brand.name',
-            label: this.$t('overall.brand')
+            label: this.$t('asset.brand')
          }, {
            key: 'model.name',
-            label: this.$t('overall.model')
+            label: this.$t('asset.model')
          }, {
            key: 'alertNum',
            icon: 'nz-icon-overview-alert',
@@ -174,11 +174,11 @@ export default {
            label: this.$t('overall.name')
          }, {
            key: 'location',
-            label: this.$t('overall.location')
+            label: this.$t('asset.location')
          }, {
            key: 'cabinetNum',
            icon: 'nz-icon-cabinet  monitorColor',
-            label: this.$t('overall.cabinet')
+            label: this.$t('asset.cabinet')
          }, {
            key: 'assetNum',
            icon: 'nz-icon-overview-project monitorColor',
@@ -279,10 +279,10 @@ export default {
            label: 'Id'
          }, {
            key: 'name',
-            label: this.$t('alert.name')
+            label: this.$t('overall.name')
          }, {
            key: 'type',
-            label: this.$t('alert.type')
+            label: this.$t('overall.type')
          }, {
            key: 'severityId',
            label: this.$t('alert.severity'),
@@ -457,7 +457,7 @@ export default {
      return style
    },
    alertruleStr () {
-      const arr = [this.$t('project.metrics.metrics'), this.$t('overall.logs'), 'SNMP trap']
+      const arr = [this.$t('overall.metric'), this.$t('overall.logs'), 'SNMP trap']
      if (this.alertLabelData.type) {
        return arr[this.alertLabelData.type - 1]
      } else {
@@ -505,10 +505,10 @@ export default {
      switch (item.type) {
        case 'asset' : str += `<span>${this.$t('overall.asset')}</span> <span>/</span> <span>${this.$t('overall.asset')}</span>`; break
        case 'datacenter' : str += `<span>${this.$t('config.config')}</span> <span>/</span> <span>${this.$t('overall.dc')}</span>`; break
-        case 'project' : str += `<span>${this.$t('config.system.monitor.monitor')}</span> <span>/</span> <span>${this.$t('dashboard.overview.project.project')}</span>`; break
+        case 'project' : str += `<span>${this.$t('config.system.monitor.monitor')}</span> <span>/</span> <span>${this.$t('project.project.projectName')}</span>`; break
        case 'module' :str += `<span>${this.$t('config.system.monitor.monitor')}</span> <span>/</span> <span>${this.$t('overall.module')}</span>`; break
        case 'endpoint' : str += `<span>${this.$t('config.system.monitor.monitor')}</span> <span>/</span> <span>${this.$t('asset.endpoint')}</span>`; break
-        case 'alertrule' : str += `<span>${this.$t('overall.alert')}</span> <span>/</span> <span>${this.$t('dashboard.overview.alert.alertRule')}</span>`; break
+        case 'alertrule' : str += `<span>${this.$t('overall.alert')}</span> <span>/</span> <span>${this.$t('alert.rule')}</span>`; break
      }
      return str
    },
--- a/nezha-fronted/src/components/common/js/common.js
+++ b/nezha-fronted/src/components/common/js/common.js
@@ -45,13 +45,11 @@ export function setTopology (key, value) {
 // const topologyImgList = localStorage.getItem('nz-imgList') ? JSON.parse(localStorage.getItem('nz-imgList')) : {}

 export function getTopologyImg (key) {
-  // console.log(topologyCache, 'topologyCache')
-  // console.log(localStorage.getItem('nz-img-' + key), !localStorage.getItem('nz-img-' + key))
-  return localStorage.getItem('nz-img-' + key)
+  return false
 }

 export function setTopologyImg (key, img) {
-  localStorage.setItem('nz-img-' + key, img)
+  // localStorage.setItem('nz-topologyImg-' + key, img)
 }

 export function setHexagon (key, value) {
--- a/nezha-fronted/src/components/common/js/constants.js
+++ b/nezha-fronted/src/components/common/js/constants.js
@@ -157,7 +157,7 @@ export const asset = {
  editTypeOptions: [
    { value: 1, label: i18n.t('overall.account') },
    { value: 2, label: i18n.t('overall.labels') },
-    { value: 3, label: i18n.t('asset.state') },
+    { value: 3, label: i18n.t('overall.state') },
    { value: 4, label: i18n.t('asset.snmpCredential') }
  ],
  editTypeData: {
@@ -198,8 +198,8 @@ export const alertMessage = {
    { value: 'P3', label: i18n.t('alert.config.P3') }
  ],
  typeData: [
-    { value: 1, label: i18n.t('alert.config.typeOption.project') },
-    { value: 2, label: i18n.t('alert.config.typeOption.module') },
+    { value: 1, label: i18n.t('project.project.projectName') },
+    { value: 2, label: i18n.t('overall.module') },
    { value: 3, label: i18n.t('alert.config.typeOption.asset') }
  ],
  levels: [
@@ -216,19 +216,19 @@ export const alertMessage = {
 }

 export const statisticsList = [
-  { value: 'min', label: i18n.t('dashboard.panel.chartForm.statisticsVal.min') },
-  { value: 'max', label: i18n.t('dashboard.panel.chartForm.statisticsVal.max') },
+  { value: 'min', label: i18n.t('dashboard.panel.chartForm.min') },
+  { value: 'max', label: i18n.t('dashboard.panel.chartForm.max') },
  { value: 'avg', label: i18n.t('dashboard.panel.chartForm.statisticsVal.average') },
-  { value: 'total', label: i18n.t('dashboard.panel.chartForm.statisticsVal.total') },
+  { value: 'total', label: i18n.t('dashboard.panel.chartTotal') },
  { value: 'first', label: i18n.t('dashboard.panel.chartForm.statisticsVal.first') },
  { value: 'last', label: i18n.t('dashboard.panel.chartForm.statisticsVal.last') },
-  { value: 'range', label: i18n.t('dashboard.panel.chartForm.statisticsVal.range') },
+  { value: 'range', label: i18n.t('dashboard.panel.chartForm.valMapping.range') },
  { value: 'different', label: i18n.t('dashboard.panel.chartForm.statisticsVal.different') }
 ]

 export const alignList = [
-  { value: 'left', label: i18n.t('dashboard.panel.chartForm.alignList.left') },
-  { value: 'center', label: i18n.t('dashboard.panel.chartForm.alignList.center') },
+  { value: 'left', label: i18n.t('project.topology.left') },
+  { value: 'center', label: i18n.t('project.topology.center') },
  { value: 'right', label: i18n.t('dashboard.panel.chartForm.alignList.right') }
 ]

@@ -277,15 +277,15 @@ export const chart = {
    },
    {
      value: 'url',
-      label: i18n.t('dashboard.panel.chartForm.typeVal.url.label')
+      label: i18n.t('dashboard.panel.chartForm.url')
    },
    {
      value: 'group',
-      label: i18n.t('dashboard.panel.chartForm.typeVal.group.label')
+      label: i18n.t('dashboard.panel.chartForm.group')
    },
    {
      value: 'logs',
-      label: i18n.t('dashboard.panel.chartForm.typeVal.logs.label')
+      label: i18n.t('overall.logs')
    },
    {
      value: 'diagram',
@@ -295,7 +295,7 @@ export const chart = {
 }

 export const intervalList = [
-  { value: -1, label: i18n.t('dashboard.panel.refreshInterval.never') },
+  { value: -1, label: i18n.t('dashboard.panel.chartForm.lockList.off') },
  { value: 30, label: '30s' },
  { value: 60, label: '1m' },
  { value: 300, label: '5m' },
@@ -306,7 +306,7 @@ export const intervalList = [
 export const setting = {
  DcState: [
    { value: 'ON', label: i18n.t('config.dc.usable') },
-    { value: 'OFF', label: i18n.t('config.dc.suspended') }
+    { value: 'OFF', label: i18n.t('asset.suspended') }
  ]
 }
 export const snmpProtocolTypes = [
--- a/nezha-fronted/src/components/common/js/tools.js
+++ b/nezha-fronted/src/components/common/js/tools.js
@@ -39,18 +39,15 @@ export const clickoutside = {
        if (oldValue) {
          // const newValue = JSON.parse(JSON.stringify(binding.value.obj))
          if (unsavedChange == 'on' && !isEqual(oldValue, el.__newValue__)) {
-            // 防止表单自动聚焦
-            setTimeout(() => {
-              MessageBox.confirm(i18n.t('tip.confirmCancel'), {
-                confirmButtonText: i18n.t('tip.yes'),
-                cancelButtonText: i18n.t('tip.no'),
-                type: 'warning'
-              }).then(() => {
-                if (binding.value.func) {
-                  binding.value.func()
-                }
-              }).catch(err => err)
-            })
+            MessageBox.confirm(i18n.t('tip.confirmCancel'), {
+              confirmButtonText: i18n.t('tip.yes'),
+              cancelButtonText: i18n.t('tip.no'),
+              type: 'warning'
+            }).then(() => {
+              if (binding.value.func) {
+                binding.value.func()
+              }
+            }).catch(err => err)
          } else {
            binding.value.func()
          }
--- a/nezha-fronted/src/components/common/js/validate.js
+++ b/nezha-fronted/src/components/common/js/validate.js
@@ -154,7 +154,7 @@ export function uSize (rule, value, callback) {
    } else {
      const num = Number(value)
      if (num < 0 || num > 47) {
-        callback(new Error(vm.$t('validate.usize')))
+        callback(new Error(vm.$t('validate.uSize')))
      } else {
        callback()
      }
--- a/nezha-fronted/src/components/common/language/newcn.js
+++ b/nezha-fronted/src/components/common/language/newcn.js
@@ -29,7 +29,7 @@ const newcn = {
    system: {
      configTitle: '系统配置',
      configTip: '请输入管理员的用户名和密码，并设置Nezha WEB模块的安装信息，如IP:port',
-      federation: '联邦',
+      federation: '集群',
      federationEnable: '可用',
      federationDisable: '不可用'
    },
@@ -65,6 +65,28 @@ const newcn = {
    verifyPlaceholder: '验证码',
    bindFail: '绑定失败'
  },
+  asset: {
+    host: 'Host',
+    port: '端口',
+    talon: {
+      enable: '启用'
+    }
+  },
+  validate: {
+    required: '必填项',
+    host: '不合法的IP',
+    number: '必须是数字',
+    port: '不合法的端口',
+    special: '不能包含特殊字符',
+    unavailable: '不可用'
+  },
+  profile: {
+    username: '用户名'
+  },
+  overall: {
+    system: '系统',
+    back: '返回'
+  },
  ...zhLocale
 }
 export default newcn
--- a/nezha-fronted/src/components/common/language/newen.js
+++ b/nezha-fronted/src/components/common/language/newen.js
@@ -73,6 +73,28 @@ const newen = {
    verifyPlaceholder: 'verify code',
    bindFail: 'Binding failure'
  },
+  asset: {
+    host: 'Host',
+    port: 'Port',
+    talon: {
+      enable: 'Enable'
+    }
+  },
+  validate: {
+    required: 'Required',
+    host: 'Invalid Host',
+    number: 'Numberic',
+    port: 'Invalid port',
+    special: 'Cannot contain special characters',
+    unavailable: 'Unavailable'
+  },
+  profile: {
+    username: 'User name'
+  },
+  overall: {
+    system: 'System',
+    back: 'Back'
+  },
  ...enLocale
 }

--- a/nezha-fronted/src/components/common/latlngPicker.vue
+++ b/nezha-fronted/src/components/common/latlngPicker.vue
@@ -3,7 +3,7 @@
    <div class="input-box">
      <div class="input-box-item" style="display: none;">
        <el-input v-model="lnglat" @blur="setLatlng" @change="setLatlng">
-          <template slot="prepend" v-if="showZoom">{{$t('config.system.basic.lnglat')}}</template>
+          <template slot="prepend" v-if="showZoom">{{$t('config.dc.lnglat')}}</template>
        </el-input>
      </div>
      <div class="input-box-item" v-if="showZoom">
--- a/Show More
+++ b/Show More