fix: 恢复detection的policy显示

fix: 修复report编辑按钮不会disabled的问题
fix: report一系列问题修改
2024-05-20 11:26:59 +08:00 · 2024-05-11 18:17:55 +08:00 · 2024-05-11 16:28:27 +08:00 · 2024-05-11 06:49:45 +00:00 · 2024-05-11 06:49:38 +00:00 · 2024-05-09 09:08:56 +00:00
109 changed files with 1229 additions and 1425 deletions
--- a/package.json
+++ b/package.json
@@ -13,7 +13,6 @@
    "@amcharts/amcharts4": "~4.10.0",
    "@amcharts/amcharts4-geodata": "^4.1.20",
    "@antv/g6": "^4.8.17",
    "@element-plus/icons-vue": "^2.3.1",
    "axios": "^0.21.1",
    "babel-plugin-lodash": "~3.3.0",
    "codemirror": "^5.65.1",
@@ -21,7 +20,7 @@
    "dayjs": "^1.10.5",
    "dexie": "~3.2.0",
    "echarts": "^5.1.1",
-    "element-plus": "^2.5.1",
+    "element-plus": "~1.0.2-beta.71",
    "lib-flexible": "^0.3.2",
    "lodash": "^4.17.21",
    "maplibre-gl": "3.6.2",
@@ -44,8 +43,8 @@
    "@babel/core": "~7.22.5",
    "@babel/plugin-proposal-class-properties": "~7.18.0",
    "@babel/plugin-proposal-private-methods": "~7.18.0",
    "@babel/plugin-proposal-private-property-in-object": "~7.21.0",
    "@babel/plugin-transform-runtime": "~7.22.0",
    "@babel/plugin-proposal-private-property-in-object": "~7.21.0",
    "@babel/preset-env": "~7.22.0",
    "@babel/preset-typescript": "~7.22.0",
    "@commitlint/cli": "^9.1.2",
@@ -68,8 +67,8 @@
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "~3.3.0",
    "@vue/component-compiler-utils": "~3.3.0",
    "@vue/server-renderer": "~3.3.0",
    "@vue/test-utils": "~2.4.0",
    "@vue/server-renderer": "~3.3.0",
    "babel-eslint": "^10.1.0",
    "babel-jest": "^26.0.0",
    "compression-webpack-plugin": "^8.0.1",
@@ -83,8 +82,6 @@
    "jest": "~26.6.0",
    "ts-jest": "~26.5.0",
    "uglifyjs-webpack-plugin": "^2.2.0",
    "unplugin-auto-import": "^0.17.5",
    "unplugin-vue-components": "^0.26.0",
    "vue-jest": "^5.0.0-alpha.10"
  },
  "browserslist": [
--- a/public/images/knowledge-base-logo/cyber-ghost.png
+++ b/public/images/knowledge-base-logo/cyber-ghost.png
--- a/public/images/knowledge-base-logo/gecko.png
+++ b/public/images/knowledge-base-logo/gecko.png
--- a/public/images/knowledge-base-logo/ivacy.png
+++ b/public/images/knowledge-base-logo/ivacy.png
--- a/public/images/knowledge-base-logo/protonvpn.png
+++ b/public/images/knowledge-base-logo/protonvpn.png
--- a/public/images/knowledge-base-logo/turbo.png
+++ b/public/images/knowledge-base-logo/turbo.png
--- a/public/images/knowledge-base-logo/vpnunlimited.png
+++ b/public/images/knowledge-base-logo/vpnunlimited.png
--- a/public/images/knowledge-base-logo/windscribe.png
+++ b/public/images/knowledge-base-logo/windscribe.png
--- a/public/index.html
+++ b/public/index.html
@@ -8,7 +8,7 @@
    <script src="config.js"></script>
    <title>Cyber Narrator</title>
  </head>
-  <body>
+  <body class="theme-light">
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
--- a/src/Login.vue
+++ b/src/Login.vue
@@ -7,33 +7,54 @@
      <el-form class="login__box">
        <el-form-item>
          <el-input
              prefix-icon="cn-icon cn-icon-user2"
              class="login--input login__input"
            v-model="username"
-          >
+          ></el-input>
            <template #prefix>
              <i class="cn-icon cn-icon-user2"></i>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-input
              class="login--input"
-              prefix-icon="Lock"
+              prefix-icon="el-icon-lock"
              type="password"
              @keyup.enter="login"
            v-model="pin"
          ></el-input>
        </el-form-item>
        <el-form-item>
-          <el-button
+          <el-button :disabled="licenseStatus !== 0"
              v-loading="loading"
              type="primary"
              class="login--input login--button"
              :class="{'login-btn__license-error':licenseStatus !== 0}"
              @click="login"
              @keyup.enter="login"
              style="font-size: 16px;"
-            >Login</el-button
+          >Login
-          >
+          </el-button>
        </el-form-item>
        <el-form-item v-if="licenseStatus !== 0">
          <div class="license-error-msg">{{licenseStatusErrMsg}}</div>
          <div class="license-file">
            <button style="position: relative;" class="license__btn margin-r-20" @click.prevent="downloadFile" @keyup.enter="login">
              <i class="cn-icon-download1 cn-icon margin-r-6"></i><span>Download c2v file</span>
            </button>
            <el-upload :action="`${baseUrl}sys/license/upload`"
                       ref="licenseUpload"
                       id="licenseUpload"
                       :multiple="false"
                       :show-file-list="false"
                       :accept="fileTypeLimit"
                       :file-list="fileList"
                       :auto-upload="false"
                       :on-change="fileChange"
                       :on-success="uploadSuccess"
                       :on-error="uploadError">
              <button style="position: relative;" class="license__btn" @click.prevent="">
                <i class="cn-icon-upload1 cn-icon margin-r-6"></i><span>Upload license</span>
              </button>
            </el-upload>
          </div>
        </el-form-item>
      </el-form>
    </div>
@@ -49,6 +70,7 @@ import { api } from '@/utils/api'
 import dayjs from 'dayjs'
 import _ from 'lodash'
 import utc from 'dayjs/plugin/utc'
 import { ref } from 'vue'
 dayjs.extend(utc)
 export default {
@@ -58,7 +80,11 @@ export default {
      loading: false,
      username: '',
      pin: '',
-      language: ''
+      language: '',
      licenseStatus: 1,
      licenseStatusErrMsg: '',
      downloadC2vUrl: api.downloadLicenseC2v,
      supportID: ''
    }
  },
  methods: {
@@ -72,6 +98,9 @@ export default {
      } else {
        return
      }
      if (this.licenseStatus !== 0) {
        return
      }
      this.loading = true
      axios.post(api.login, { username: this.username, pin: this.pin }).then(
        res => {
@@ -92,7 +121,6 @@ export default {
            // localStorage.setItem(storageKey.userId, res.data.data.user.userId)
            localStorage.setItem(storageKey.userId, res.data.data.user.id)
            localStorage.setItem(storageKey.token, res.data.data.token)
            // const theme =
            this.$i18n.locale = localStorage.getItem(storageKey.language)
          }
        }
@@ -107,6 +135,72 @@ export default {
        }
      })
    },
    downloadFile () {
      axios.get(this.downloadC2vUrl, { responseType: 'blob' }).then(res => {
        const disposition = res.headers['content-disposition']
        const fileName = decodeURI(disposition.split('filename=')[1])
        if (window.navigator.msSaveOrOpenBlob) {
          // 兼容ie11
          const blobObject = new Blob([res.data])
          window.navigator.msSaveOrOpenBlob(blobObject, fileName)
        } else {
          const url = URL.createObjectURL(new Blob([res.data]))
          const a = document.createElement('a')
          document.body.appendChild(a) // 此处增加了将创建的添加到body当中
          a.href = url
          a.download = fileName
          a.target = '_blank'
          a.click()
          a.remove() // 将a标签移除
        }
      }, error => {
        const $self = this
        const reader = new FileReader()
        reader.onload = function (event) {
          const responseText = reader.result
          const exception = JSON.parse(responseText)
          if (exception.message) {
            $self.$message.error(exception.message)
          } else {
            console.error(error)
          }
        }
        reader.readAsText(error.response.data)
      })
    },
    fileChange (file, fileList) {
      if (file.status !== 'ready') return
      if (!_.endsWith(file.name, '.xml')) {
        this.fileList = []
        this.$message.error('Only support '+ this.fileTypeLimit + ' files')
      } else {
        this.fileList = fileList.slice(-1)
        this.$refs.licenseUpload.submit()
      }
    },
    uploadSuccess (response) {
      this.$message.success('Success')
      this.licenseStatus = 0
    },
    uploadError (error) {
      let errorMsg
      if (error.message) {
        errorMsg = JSON.parse(error.message).message
      } else {
        errorMsg = 'error'
      }
      this.licenseStatus = 1
      this.$message.error('Upload failed: ' + errorMsg)
    },
    checkLicenseStatus () {
      axios.get(api.licenseStatus).then(res => {
        if (res.status === 200) {
          this.licenseStatus = res.data.data.status
        }
      }).catch(e => {
        this.licenseStatusErrMsg = this.errorMsgHandler(e)
      })
    },
    queryAppearance () {
      axios.get(api.appearance).then(res => {
        if (res.status === 200) {
@@ -132,19 +226,23 @@ export default {
      localStorage.setItem(storageKey.sysLogo, data.system_logo)
    }
  },
-  mounted () {
+  async mounted () {
    this.queryAppearance()
    this.checkLicenseStatus()
  },
  setup (props) {
    const { currentRoute } = useRouter()
    return {
-      loginSuccessPath: currentRoute.value.query.redirect
+      loginSuccessPath: currentRoute.value.query.redirect,
      baseUrl: BASE_CONFIG.baseUrl,
      fileTypeLimit: '.xml',
      fileList: ref([])
    }
  }
 }
 </script>
-<style scoped lang="scss">
+<style scoped>
 .logins {
  background-color: #000C18;
  background-size: auto;
@@ -157,12 +255,12 @@ export default {
 }
 :deep .el-input__inner {
-  //background-color: #0B325C !important;
+  background-color: #0B325C !important;
  border: none;
-  //border-radius: 0px;
+  border-radius: 0px;
-  //border-bottom: 1px solid #295688;
+  border-bottom: 1px solid #295688;
  font-size: 14px;
-  //line-height: 14px;
+  line-height: 14px;
 }
 :deep .el-input__inner:hover {
  border-color: #295688;
@@ -182,11 +280,10 @@ export default {
  -webkit-text-fill-color: rgba(231,234,237, .8) !important;
  transition: background-color 500000000000000000s ease-in-out 0s !important;
  caret-color: #fff ;
  font-size: 14px;
 }
 .inside {
  width: 414px;
-  height: 524px;
+  height: fit-content;/*524*/
  background: #0B325C;
  border: 1px solid rgba(103,179,245,0.65);
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.38);
@@ -203,6 +300,7 @@ export default {
 .title {
  margin-top: 65px;
  margin-bottom: 44px;
  text-align: center;
 }
 .title > img {
@@ -213,6 +311,39 @@ export default {
  justify-content: center;
  flex-direction: column;
  align-items: center;
  .is-disabled {
    background: #21B4ED;
    color: #FFFFFF;
    opacity: 0.6;
  }
  .license-error-msg {
    color:#c73249;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    height:40px;
  }
  .license-file {
    display: flex;
    flex-direction: row;
    height: 100%;
    align-items: center;
    justify-content: space-between;
    .license__btn {
      height: 40px;
      padding-left:10px;
      padding-right:10px;
      min-width: 74px;
      color: white;
      background-color: #21B4ED;
      border: none;
      border-radius: 4px;
      outline: none;
      font-size: 14px;
      cursor: pointer;
      transition: background-color linear .2s, color linear .1s;
    }
  }
 }
 :deep .el-form-item {
  width: 334px;
@@ -225,9 +356,8 @@ export default {
  width: 17px;
  font-size: 17px;
 }
-.login__box .el-form-item:nth-of-type(3) {
+.login__box .el-form-item:nth-child(3){
-  margin-top: 25px;
+  margin-bottom: 0px;
  margin-bottom: 65px;
 }
 .login--button {
  background: #21B4ED;
@@ -239,22 +369,12 @@ export default {
  line-height: 22px;
  width: 334px;
  height: 52px;
  margin-top: 25px;
  margin-bottom:65px;
 }
-.login--input {
+.login-btn__license-error {
-  :deep .el-input__wrapper {
+  margin-top: 25px;
-    background-color: rgb(11, 50, 92) !important;
+  margin-bottom: 10px;
    box-shadow: none !important;
    //border-bottom: 1px solid rgba(103,179,245,0.65);
    border-bottom: 1px solid #295688;
    border-radius: 0;
  height:40px;
    line-height: 40px;
    font-size: 14px;
    padding: 1px 4px 2px 5px;
  }
  :deep .el-input__wrapper.is-focus {
    box-shadow: none !important;
  }
 }
 </style>
--- a/src/assets/css/common/cover-element-plus.scss
+++ b/src/assets/css/common/cover-element-plus.scss
@@ -1,90 +0,0 @@
 .el-drawer__body {
  padding: 0 !important;
 }
 .el-tabs__item {
  display: inline-block !important;
  height: var(--el-tabs-header-height);
  line-height: var(--el-tabs-header-height);
 }
 .el-table--border::before, .el-table__border-left-patch {
  width: 0 !important;
 }
 .el-table--border .el-table__inner-wrapper::after, .el-table__inner-wrapper::before {
  height: 0 !important;
 }
 .el-popper.is-pure {
  margin-top: -10px;
 }
 .el-select__wrapper {
  min-height: 28px !important;
 }
 .el-input__wrapper {
  height: 28px;
 }
 .el-input--mini .el-input__inner {
  height: 28px !important;
  line-height: 28px !important;
 }
 .el-table td.el-table__cell div {
  margin-left: -1px;
 }
 .el-table .sort-caret.ascending {
  border-bottom-color: #c0c4cc !important;
 }
 .el-table .ascending .sort-caret.ascending {
  border-bottom-color: #699dc9 !important;
 }
 .el-table .sort-caret.descending {
  border-top-color: #c0c4cc !important;
 }
 .el-table .descending .sort-caret.descending {
  border-top-color: #699dc9 !important;
 }
 .el-radio.el-radio--large {
  height: auto !important;
 }
 .el-radio {
  height: auto !important;
 }
 .el-radio__input.is-checked + .el-radio__label {
  color: $--color-primary !important;
 }
 .el-radio__input.is-checked .el-radio__inner {
  background: $--color-primary !important;
  border-color: $--color-primary !important;
 }
 .el-radio__label {
  padding-left: 10px !important;
 }
 .el-tag {
  min-width: 24px;
  height: 24px !important;
  line-height: 24px !important;
 }
 .el-popover.el-popper {
  padding: 0 !important;
 }
 .my-header-cell-class .el-checkbox__input{
  display: none;
 }
 .el-dialog {
  padding: 0 !important;
 }
 .el-switch.is-checked .el-switch__core {
  background-color: $--color-primary !important;
 }
 .el-date-table td.end-date .el-date-table-cell__text, .el-date-table td.start-date .el-date-table-cell__text {
  background-color: $--color-primary !important;
 }
 .el-date-table td.available:hover {
  color: $--color-primary !important;
 }
 .el-picker__popper.el-popper {
  margin-top: 8px;
 }
 //.el-button:hover {
 //  color: $--color-primary !important;
 //  border-color: $--color-primary !important;
 //}
--- a/src/assets/css/common/part-select.scss
+++ b/src/assets/css/common/part-select.scss
@@ -1,6 +1,6 @@
 // 部分 select 通用样式
 .common-select.el-select__popper {
-  //top: 27px !important;
+  top: 27px !important;
  .el-popper__arrow {
    display: none;
  }
--- a/src/assets/css/common/right-box-common.scss
+++ b/src/assets/css/common/right-box-common.scss
@@ -64,9 +64,6 @@
          }
        }
      }
    }
    .container__form {
    }
    .el-form-item__content {
      .input-box {
@@ -139,9 +136,6 @@
        .el-input__inner:focus {
          border-color: darken($--right-box-border-color, 20%);
        }
        .el-form-item__label {
          padding-bottom: 2px;
        }
      }
      .el-form-item.is-error .el-input__inner, .el-form-item.is-error .el-input__inner:focus, .el-form-item.is-error .el-textarea__inner, .el-form-item.is-error .el-textarea__inner:focus, .el-message-box__input input.invalid, .el-message-box__input input.invalid:focus {
        border-color: #F56C6C
@@ -307,24 +301,4 @@
  .el-form-item__content .el-autocomplete .el-input-group {
    vertical-align: unset;
  }
  .el-input__wrapper {
    border-radius: 2px;
    height: 32px !important;
    line-height: 32px !important;
    //box-shadow: 0 0 0 1px var(--el-input-border-color,var(--el-border-color)) inset;
    box-shadow: 0 0 0 1px #e7eaed inset;
  }
  .el-input__inner, .el-textarea__inner {
    border: none !important;
  }
  .el-select__wrapper {
    height: 32px;
    line-height: 32px;
  }
  .el-switch.is-checked .el-switch__core {
    background-color: $--color-primary;
  }
  .el-textarea__inner {
    font-size: 12px;
  }
 }
--- a/src/assets/css/common/table-common.scss
+++ b/src/assets/css/common/table-common.scss
@@ -55,10 +55,6 @@
     .top-tool-btn--search:focus {
       border-left: none !important;
     }
      .el-input--small .el-input__wrapper {
        height: 28px !important;
        border-radius: 2px 0 0 2px !important;
      }
    }
    .top-tool-right {
@@ -200,7 +196,7 @@
      position: absolute;
      width: calc(100% - 40px);
      border: 1px solid $--right-box-border-color;
-      //border-bottom: none;
+      border-bottom: none;
      border-radius:4px;
      .caret-wrapper {
@@ -218,7 +214,7 @@
      }
      td {
-        padding: 3px 0 4px 0;
+        padding: 8px 0;
        border-bottom: 1px solid $--right-box-border-color;
      }
      th {
@@ -403,9 +399,6 @@
 .margin-t-20{
  margin-top: 20px;
 }
 .margin-r-3{
  margin-right: 3px;
 }
 .tooltip-column-name {
  color: #aeb0b9;
  height:40px;
--- a/src/assets/css/components/components/advancedSearch/advanced-search2.scss
+++ b/src/assets/css/components/components/advancedSearch/advanced-search2.scss
@@ -16,7 +16,7 @@
          margin-right: 12px;
          background-color: transparent;
-          i {
+          .el-icon-search {
            color: #3976CB;
          }
        }
@@ -51,14 +51,14 @@
          line-height: 39px;
          background: #38ACD2;
-          i {
+          .el-icon-search {
            font-size: 22px;
            color: #fff;
          }
        }
      }
      .search__suffix-close {
-        i {
+        .el-icon-error {
          font-size: 17px;
          color: #C4C4C4;
          cursor: pointer;
@@ -87,7 +87,7 @@
  border-radius: 2px;
  padding-left: 10px;
  padding-right: 80px;
-  background-color: $--select-bg-color-1;
+  background-color: white;
  border: 1px solid #DEDEDE;
  &::-webkit-scrollbar {
@@ -151,20 +151,6 @@
        color: #333;
        font-weight: bold;
        cursor: text;
        .el-select {
          min-width: 210px !important;
          min-height: 20px !important;
          height: 20px;
          cursor: pointer;
        }
        .el-select__wrapper {
          height: 28px;
          margin-top: -4px;
          cursor: pointer;
        }
        .el-select__wrapper.is-focused {
          box-shadow: 0 0 0 1px $--color-primary inset !important;
        }
      }
      .condition__operator {
        color: #3976CB;
@@ -194,13 +180,7 @@
  padding-left: 65px;
 }
-.my-popper-class {
+.el-popover.my-popper-class {
  width: auto !important;
-  padding: 8px 10px !important;
+  padding: 8px 12px !important;
 }
 .el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px $--color-primary inset !important;
 }
 .el-select-dropdown__item.is-selected {
  color: #2c72c6 !important;
 }
--- a/src/assets/css/components/components/advancedSearch/codemirror.scss
+++ b/src/assets/css/components/components/advancedSearch/codemirror.scss
@@ -2,7 +2,7 @@
 .CodeMirror {
  /* Set height, width, borders, and global font properties here */
-  height: 40px !important;
+  height: 40px;
  color: black;
  direction: ltr;
  border: 1px solid #CECECE;
@@ -22,7 +22,7 @@
 /* PADDING */
 .CodeMirror-lines {
-  //padding: 9px 5px; /* Vertical padding around content */
+  padding: 9px 5px; /* Vertical padding around content */
 }
 .CodeMirror pre.CodeMirror-line,
 .CodeMirror pre.CodeMirror-line-like {
@@ -187,8 +187,6 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
  position: relative;
  border-right: 50px solid transparent;
  width: 3000px; // 避免搜索过长导致换行
  height: 30px;
  overflow-y: hidden;
 }
 /* The fake, visible scrollbars. Used to force redraw during scrolling
@@ -224,7 +222,7 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
 }
 .CodeMirror-gutter {
  white-space: normal;
-  height: 100% !important;
+  height: 100%;
  display: inline-block;
  vertical-align: top;
  margin-bottom: -50px;
@@ -251,7 +249,6 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
 .CodeMirror-lines {
  cursor: text;
  min-height: 1px; /* prevents collapsing before first draw */
  margin-top: 4px;
 }
 .CodeMirror pre.CodeMirror-line,
 .CodeMirror pre.CodeMirror-line-like {
@@ -394,6 +391,11 @@ span.CodeMirror-selectedtext { background: none; }
  //color: #D85512;
 }
 .CodeMirror-lines {
  /*height: 20px;*/
  //padding: 3px 0;
 }
 .in-coder-panel {
  margin-left: 2px;
 }
--- a/src/assets/css/components/components/common/TimeRange/date-time-range.scss
+++ b/src/assets/css/components/components/common/TimeRange/date-time-range.scss
@@ -32,10 +32,8 @@
    padding: 0 10px;
    display: flex;
    justify-content: space-around;
-    //background: #FFFFFF;
+    background: #FFFFFF;
-    background: var(--el-fill-color-blank);
+    border: 1px solid #DEDEDE;
    //border: 1px solid #DEDEDE;
    border: 1px solid var(--el-border-color);
    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
    border-radius: 2px;
    height: 28px;
@@ -58,8 +56,7 @@
  .date-range-title {
    font-size: 14px;
-    //color: #666666;
+    color: #666666;
    color: $--text-color-4;
    font-weight: 600;
    padding: 14px 0 7px 8px;
  }
@@ -74,8 +71,7 @@
    white-space: nowrap;
    display: inline-block;
    margin: 0 5px;
-    //color: #353636;
+    color: #353636;
    color: $--text-color-1;
    .cn-icon-Data {
      color: #575757;
    }
@@ -92,8 +88,7 @@
  .date-range-panel {
    height: 426px;
    width: 500px;
-    //background: #FFFFFF;
+    background: #FFFFFF;
    background: $--select-bg-color-1;
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    position: absolute;
    right: 0;
@@ -107,8 +102,7 @@
      .content-title {
        font-size: 14px;
-        //color: #666666;
+        color: #666666;
        color: var(--el-text-color-primary);
        font-weight: 400;
        margin-bottom: 12px;
      }
@@ -140,13 +134,9 @@
        .date-range-history-item:hover {
          /*font-weight: 600;*/
-          //background: #f9f9f9;
+          background: #f9f9f9;
          background: $--select-bg-color-hover-1;
        }
      }
      .el-range-editor.el-input__wrapper{
        opacity: 0;
      }
    }
    .date-range-panel-content-right {
@@ -166,18 +156,15 @@
          display: flex;
          flex-direction: column;
          justify-content: center;
-          //color: #333333;
+          color: #333333;
          color: var(--el-text-color-primary);
          font-weight: 400;
          padding: 0 10px;
          cursor: pointer;
        }
        li.active {
-          //background: #F2F9FF;
+          background: #F2F9FF;
-          //color: #0091FF;
+          color: #0091FF;
          background: $--select-bg-color-1;
          color: var(--el-color-primary);
          font-weight: 400;
          .cn-icon-check {
@@ -188,10 +175,8 @@
        }
        li:hover {
-          //background: #F2F9FF;
+          background: #F2F9FF;
-          background: var(--el-color-primary-light-9);
+          color: #0091FF;
          //color: #0091FF;
          color: var(--el-color-primary);
        }
      }
    }
--- a/src/assets/css/components/components/common/TimeRange/time-refresh.scss
+++ b/src/assets/css/components/components/common/TimeRange/time-refresh.scss
@@ -17,9 +17,8 @@
  .refresh-list{
    position: absolute;
    z-index: 2;
-    //background: #FFFFFF;
+    background: #FFFFFF;
-    background: $--select-bg-color-1;
+    border: 1px solid #DEDEDE;
    border: 1px solid var(--el-border-color);
    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
    border-radius: 2px;
    top: 30px;
@@ -30,13 +29,13 @@
      display: flex;
      flex-direction: column;
      justify-content: center;
-      color: $--text-color-5;
+      color: #333333;
      cursor: pointer;
      position: relative;
      padding: 8px 0 8px 12px;
    }
    .refresh-list-item.active{
-      background: $--select-bg-color-1;
+      background: #F2F9FF;
      color: #0091FF;
      font-weight: 400;
      .cn-icon-check{
@@ -46,8 +45,7 @@
      }
    }
    .refresh-list-item:hover{
-      //background: #F2F9FF;
+      background: #F2F9FF;
      background: $--select-bg-color-hover-1;
      color: #0091FF;
    }
  }
@@ -68,6 +66,5 @@
  .el-button--mini{
    padding: 4px 6px !important;
    min-height: 28px !important;
    height: 28px !important;
  }
 }
--- a/src/assets/css/components/components/common/chart-tab.scss
+++ b/src/assets/css/components/components/common/chart-tab.scss
@@ -17,9 +17,8 @@
    box-shadow: none;
    &>.el-tabs__header {
-      //background-color: white;
+      background-color: white;
-      background-color: $--select-bg-color-1;
+      border-color: #E2E5EC;
      border-color: $--border-color-2;
      .el-tabs__nav-wrap {
        padding-left: 27px;
@@ -34,7 +33,6 @@
  }
  .el-tabs__nav {
    z-index: 1;
    display: inline-block;
  }
  .el-tabs__item.is-top {
@@ -42,7 +40,7 @@
    line-height: 35px;
    .chart-tabs__label {
-      color: $--text-color-1;
+      color: #353636;
      font-size: 14px;
      font-weight: bold;
      box-sizing: border-box;
@@ -55,7 +53,7 @@
    }
    &.is-active {
      .chart-tabs__label {
-        color: $--text-color-1;
+        color: #353636;
        i {
          color: #046EC9;
--- a/src/assets/css/components/components/common/pagination.scss
+++ b/src/assets/css/components/components/common/pagination.scss
@@ -1,89 +1,16 @@
 //.pagination {
 //  padding-top: 8px;
 //  text-align: center;
 //  max-height: 42px;
 //
 //  .el-pagination {
 //    max-height: 42px;
 //    padding-right: 0;
 //  }
 //  .pagination-size-select .el-input--mini .el-input__inner{
 //    height: 20px;
 //    line-height: 20px;
 //    margin: 5px 0 5px 5px;
 //  }
 //  .el-pager li, .el-pagination .btn-next, .el-pagination .btn-prev {
 //    margin:5px 5px 0 5px;
 //    padding: 0 4px;
 //    font-size: 13px;
 //    min-width: 20px;
 //    height: 20px;
 //    line-height: 20px;
 //    text-align: center;
 //    border: 1px solid rgba(154,154,154,0.20);
 //    border-radius: 2px;
 //  }
 //  .el-pagination .el-pager li.btn-quicknext, .el-pager li.btn-quickprev {
 //    line-height: 20px;
 //  }
 //  .el-pagination .el-pager .more::before {
 //    line-height: 20px;
 //  }
 //  .el-pagination .el-pager .more {
 //    background-color: $--content-right-background-color;
 //  }
 //  .btn-next, .btn-prev {
 //    background-color: $--content-right-background-color !important;
 //  }
 //  input {
 //    background-color: $--content-right-background-color !important;
 //  }
 //  .el-pager li.number {
 //    color: #666666;
 //    letter-spacing: 0;
 //    font-weight:normal;
 //    background-color: $--content-right-background-color;
 //  }
 //  .el-pager li.number.active {
 //    color: #FFFFFF;
 //    letter-spacing: 0;
 //  }
 //
 //  .el-pagination .el-pager li.active {
 //    background-color: $--color-primary;
 //    border-radius: 2px;
 //  }
 //  .el-pager li:hover, .el-pagination .btn-next:hover, .el-pagination .btn-prev:hover {
 //    color: #666666;
 //    letter-spacing: 0;
 //    font-weight:normal;
 //  }
 //  .el-pagination__sizes .el-input .el-input__inner, .el-pagination__editor.el-input .el-input__inner {
 //    height: 20px;
 //    border-color: rgba(154,154,154,0.20);
 //  }
 //  .el-pagination__sizes .el-input .el-input__inner:hover {
 //    border-color: rgba(154,154,154,0.20);
 //  }
 //}
 //.entity__pagination .pagination {
 //  .el-pager li.more + li {
 //    display: none;
 //  }
 //  .el-pager li.number:not(:last-of-type) {
 //    display: inline-block !important;
 //  }
 //}
 .pagination {
  //max-height: 42px;
  padding-top: 8px;
-  display: flex;
+  text-align: center;
-  justify-content: center;
+  max-height: 42px;
-  align-items: center;
+
-  .el-pagination__total {
+  .el-pagination {
-    margin-right: 10px;
+    max-height: 42px;
-    font-size: 13px;
+    padding-right: 0;
  }
  .pagination-size-select .el-input--mini .el-input__inner{
    height: 20px;
    line-height: 20px;
    margin: 5px 0 5px 5px;
  }
  .el-pager li, .el-pagination .btn-next, .el-pagination .btn-prev {
    margin:5px 5px 0 5px;
@@ -96,44 +23,54 @@
    border: 1px solid rgba(154,154,154,0.20);
    border-radius: 2px;
  }
-  .el-pagination .btn-prev {
+  .el-pagination .el-pager li.btn-quicknext, .el-pager li.btn-quickprev {
    line-height: 20px;
  }
  .el-pagination .el-pager .more::before {
    line-height: 20px;
  }
  .el-pagination .el-pager .more {
    background-color: $--content-right-background-color;
  }
  .btn-next, .btn-prev {
    background-color: $--content-right-background-color !important;
  }
  input {
    background-color: $--content-right-background-color !important;
  }
  .el-pager li.number {
    color: #666666;
    letter-spacing: 0;
    font-weight:normal;
    background-color: $--content-right-background-color;
  }
  .el-pager li.number.active {
    color: #FFFFFF;
    letter-spacing: 0;
  }
  .el-pagination .el-pager li.active {
    background-color: $--color-primary;
    border-radius: 2px;
  }
  .el-pager li:hover, .el-pagination .btn-next:hover, .el-pagination .btn-prev:hover {
    color: #666666;
    letter-spacing: 0;
    font-weight:normal;
  }
-  .btn-next, .btn-prev {
+  .el-pagination__sizes .el-input .el-input__inner, .el-pagination__editor.el-input .el-input__inner {
    background-color: $--content-right-background-color !important;
  }
  .el-pager li.is-active {
    background-color: #699dc9;
    color: #fff;
    font-weight: 500;
  }
  .el-pager li, .el-pagination .btn-next, .el-pagination .btn-prev {
    margin-top: 0;
  }
  .el-select {
    width: 100px !important;
    margin-left: 3px;
  }
  .pagination-size-select .el-select__wrapper{
    width: 100px;
    height: 20px;
-    line-height: 20px;
+    border-color: rgba(154,154,154,0.20);
    min-height: 20px !important;
    margin: 5px 0 5px 5px;
    padding: 4px 8px 4px 10px;
    font-size: 12px;
    border-radius: 2px;
  }
-  .el-select__suffix {
+  .el-pagination__sizes .el-input .el-input__inner:hover {
-    svg {
+    border-color: rgba(154,154,154,0.20);
      width: 12px;
      height: 12px;
  }
 }
-  //el-icon el-select__caret el-select__icon
+.entity__pagination .pagination {
  .el-pager li.more + li {
    display: none;
  }
  .el-pager li.number:not(:last-of-type) {
    display: inline-block !important;
  }
 }
--- a/src/assets/css/components/components/layout/layout.scss
+++ b/src/assets/css/components/components/layout/layout.scss
@@ -1,7 +1,6 @@
 .cn-container {
  height: calc(100% - 100px);
-  //background-color: $--content-right-background-color;
+  background-color: $--content-right-background-color;
  background-color: var(--bg-color);
  width: 100%;
  &>div {
    height: 100%;
@@ -50,9 +49,8 @@
    display: flex;
    align-items: center;
    height: 40px;
-    //background-color: #f7f7f7;
+    background-color: #f7f7f7;
-    background-color: var(--el-bg-color-overlay);
+    border-bottom: 1px solid #E2E5EC;
    border-bottom: 1px solid $--border-color;
    .cn-icon-a-NetworkAnalytics {
      margin-left: 20px;
@@ -70,6 +68,88 @@
      .header__left-breadcrumb-item-select{
        display:flex;
        align-items: center;
        .search-input{
          width:100%;
          padding: 4px 4px 0px 4px;
          .el-input__inner{
            padding:0px 4px;
            background: #FFFFFF;
            border: 1px solid #C5C5C5;
            box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
            border-radius: 2px;
            font-size: 12px;
            /*color: rgba(87,87,87,0.60);*/
            letter-spacing: 0;
            font-weight: 400;
          }
        }
        .breadcrumb-button{
          align-items: center;
          width: 100%;
          height: 24px;
          justify-content: center;
          line-height: 24px;
          padding: 0px 6px;
          span {
            margin-right: 6px;
          }
        }
        .breadcrumb-button:hover,.breadcrumb-button__active {
          cursor:pointer;
          background: rgba(113,113,113,0.10);
          box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
          border-radius: 2px;
        }
        .breadcrumb__popper{
            top: -7px !important;
            width:auto !important;
            max-height:206px;
            overflow:hidden;
            padding: 0px !important;
            background: #FFFFFF;
            border:1px solid #C5C5C5 !important;
            box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85)!important;
            border-radius: 2px !important;
            .el-row {
              width: 100% !important;
            }
            .selected {
              color: #0091ff;
              font-weight: bold;
            }
            .el-popper {
              max-height: 405px;
            }
            .select-dropdown {
              max-height:172px;
              width:100%;
              margin: 1px 0px;
              overflow:auto;
              list-style: none;
              padding:4px 0px;
              box-sizing: border-box;
              .select-dropdown__item:hover{
                background-color: #F5F7FA !important;
              }
              .select-dropdown__item{
                width:100%;
                height:30px;
                padding:0px 11px;
                line-height:30px;
                position: relative;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                color: #666665;
                display: list-item;
                text-align: -webkit-match-parent;
                box-sizing: border-box;
                cursor: pointer;
                font-size: 12px;
                font-weight: 400;
              }
            }
        }
      }
    }
  }
@@ -166,9 +246,6 @@
        font-size: 12px;
      }
    }
    .header-menu--item {
      outline-style: initial;
    }
  }
  .left-menu--pin {
    width: 20px;
@@ -216,93 +293,3 @@
  border-radius: 4px;
  border: 2px solid transparent;
 }
 .breadcrumb__popper{
  top: 96px !important;
  width: 180px !important;
  min-width: 180px;
  max-height:206px;
  overflow:hidden;
  padding: 0 !important;
  background: #963131;
  border:1px solid #C5C5C5 !important;
  box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85)!important;
  border-radius: 2px !important;
  .el-row {
    width: 100% !important;
  }
  .selected {
    color: #0091ff;
    font-weight: bold;
  }
  .el-popper {
    max-height: 405px;
  }
  .select-dropdown {
    max-height:172px;
    width:100%;
    margin: 1px 0px;
    overflow:auto;
    list-style: none;
    padding:4px 0px;
    box-sizing: border-box;
    .select-dropdown__item:hover{
      background-color: #F5F7FA !important;
    }
    .select-dropdown__item{
      width:100%;
      height:30px;
      padding:0px 11px;
      line-height:30px;
      position: relative;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      color: #666665;
      display: list-item;
      text-align: -webkit-match-parent;
      box-sizing: border-box;
      cursor: pointer;
      font-size: 12px;
      font-weight: 400;
    }
  }
 }
 .search-input{
  width:100%;
  padding: 4px 4px 0px 4px;
  .el-input__wrapper {
    border: 1px solid #C5C5C5;
    box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
  }
  .el-input__inner{
    //padding:0px 4px;
    //background: #FFFFFF;
    //border: 1px solid #C5C5C5;
    //box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
    border-radius: 2px;
    font-size: 12px;
    /*color: rgba(87,87,87,0.60);*/
    letter-spacing: 0;
    font-weight: 400;
    margin-left: -7px;
  }
 }
 .breadcrumb-button{
  align-items: center;
  width: 100%;
  height: 24px;
  justify-content: center;
  line-height: 24px;
  padding: 0px 6px;
  span {
    margin-right: 6px;
  }
 }
 .breadcrumb-button:hover,.breadcrumb-button__active {
  cursor:pointer;
  background: rgba(113,113,113,0.10);
  box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
  border-radius: 2px;
 }
--- a/src/assets/css/components/components/rightBox/report/reportBox.scss
+++ b/src/assets/css/components/components/rightBox/report/reportBox.scss
@@ -4,7 +4,6 @@
      .el-checkbox {
        margin-right: 24px;
        line-height: 28px;
        margin-top: -2px;
      }
      .el-checkbox-group {
        line-height: 28px;
@@ -109,40 +108,10 @@
        height: 32px;
        margin: 10px 0 0 10px;
      }
      .el-input__wrapper {
        height: 32px !important;
        padding: 1px 11px !important;
        border-radius: 2px;
      }
      .el-input__inner {
        padding: 0;
      }
      .el-form-item__content {
        line-height: 40px !important;
      }
    }
    .el-input__inner {
      border: none;
    }
    .el-select--small .el-select__wrapper {
      padding: 0 10px;
      min-height: 32px !important;
      line-height: 32px !important;
      margin-top: -2px;
      border-radius: 2px;
    }
  }
  .right-box__select--param {
-    //.el-select--small .el-select__prefix {
+    .el-input__prefix {
    //  left: 0;
    //  background-color: #f5f7fa;
    //  color: #999;
    //  padding: 0 1.07143rem;
    //  border: 1px solid #dcdfe6;
    //  border-radius: 2px 0 0 2px;
    //}
    .el-select__prefix, .el-input__prefix {
      left: 0;
      background-color: #f5f7fa;
      color: #999;
@@ -150,11 +119,5 @@
      border: 1px solid #dcdfe6;
      border-radius: 2px 0 0 2px;
    }
    .el-select__wrapper {
      padding-left: 0 !important;
  }
 }
 }
 .my-form-item .el-form-item__content {
  display: block !important;
 }
--- a/src/assets/css/components/components/table/common.scss
+++ b/src/assets/css/components/components/table/common.scss
@@ -86,12 +86,9 @@
  width:28px !important;
  height:28px !important;
  padding:unset !important;
  display: flex;
  align-items: center;
  justify-content: center;
  i {
    font-size: 14px;
-    color: $--text-color-2;
+    color: #575757;
    margin-right:unset !important;
  }
 }
--- a/src/assets/css/components/index.scss
+++ b/src/assets/css/components/index.scss
@@ -80,6 +80,7 @@
@import 'views/administration/AdministrationTabs';
@import 'views/administration/Appearance.scss';
@import 'views/administration/License.scss';
@import 'views/system/Plugin';
--- a/src/assets/css/components/views/administration/Appearance.scss
+++ b/src/assets/css/components/views/administration/Appearance.scss
@@ -10,21 +10,6 @@
    display: flex;
    flex-direction: column;
    height: 100%;
    .el-form-item {
      margin-bottom: 27px;
    }
    .el-form-item__content {
      width: 600px;
      .el-select__wrapper {
        min-height: 32px !important;
        line-height: 32px;
        padding: 0 10px 0 16px;
        font-size: 13px;
      }
    }
    .el-form--default.el-form--label-top .el-form-item .el-form-item__label {
      margin-bottom: 4px;
    }
    .el-input {
      width:600px;
    }
@@ -75,6 +60,3 @@
    }
  }
 }
 .el-popper.is-pure {
  margin-top: 0;
 }
--- a/src/assets/css/components/views/administration/License.scss
+++ b/src/assets/css/components/views/administration/License.scss
@@ -0,0 +1,61 @@
 .license{
  height: 100%;
  .license-form {
    padding-top:40px;
    padding-left:100px;
    background-color: white;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    .license-file {
      display: flex;
      flex-direction: row;
      height: 100%;
      margin-top: 3px;
      .license__btn {
        height: 30px;
        min-width: 74px;
        color: white;
        background-color: #38ACD2;
        border: none;
        border-radius: 4px;
        outline: none;
        font-size: 14px;
        cursor: pointer;
        transition: background-color linear .2s, color linear .1s;
      }
      .license__btn:hover:not(.footer__btn--disabled) {
        background-color: lighten(#38ACD2, 10%);
      }
      .license__btn--light {
        background-color: #F5F6F7;
        border: 1px solid $--border-color-primary;
        color: #333;
      }
      .license__btn.license__btn--light:hover:not(.license__btn--disabled) {
        background-color: white;
        border-color: lighten(#38ACD2, 40%);
        color: #38ACD2;
      }
      .license__btn--disabled {
        opacity: .6;
        cursor: default;
      }
    }
    .el-form .el-form-item {
      margin-bottom: 0;
      padding:4px 0;
      font-size: 14px!important;
      .el-form-item__label {
        color: #262626 !important;
        font-weight: bold;
      }
      .el-form-item__content {
        color: #262626 !important;
        font-weight: 400;
      }
    }
  }
 }
--- a/src/assets/css/components/views/charts2/dnsEventChart.scss
+++ b/src/assets/css/components/views/charts2/dnsEventChart.scss
@@ -1,7 +1,7 @@
 .dns-event-chart {
  width: 100%;
  height: 100%;
-  border: 1px solid $--border-color;
+  border: 1px solid #E2E5EC;
  border-radius: 4px;
  display: flex;
  justify-content: space-between;
--- a/src/assets/css/components/views/charts2/entityDetailBasicInfo.scss
+++ b/src/assets/css/components/views/charts2/entityDetailBasicInfo.scss
@@ -1,7 +1,7 @@
 .el-popper.analysis-popper {
-  margin-top: -5px !important;
+  top: -5px !important;
  padding: 0;
-  border: 1px solid #C5C5C5 !important;
+  border: 1px solid #C5C5C5;
  border-radius: 4px;
  box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
--- a/src/assets/css/components/views/charts2/entityDetailLine.scss
+++ b/src/assets/css/components/views/charts2/entityDetailLine.scss
@@ -8,7 +8,7 @@
      align-items: center;
      & > .el-select {
-        width: 162px !important;
+        width: 162px;
        margin-right: 10px;
        .select-prefix {
@@ -34,23 +34,15 @@
    .line-select-metric {
      margin-right: 20px;
-      .el-select__wrapper {
+      .el-input__inner {
        width: 127px;
        height: 24px;
        line-height: 24px;
        min-height: 24px !important;
        padding-left: 4px;
        font-size: 12px;
        color: #2C72C6;
        font-weight: 400;
        border-radius: 2px;
        .el-select__placeholder {
          color: #2C72C6 !important;
          margin-left: 1px;
        }
        .el-select__suffix {
          margin-right: -2px;
          margin-top: 2px;
        }
      }
    }
--- a/src/assets/css/components/views/charts2/networkOverviewApps.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewApps.scss
@@ -7,7 +7,7 @@
    .network-overview-apps-title {
      font-size: 14px;
-      color: $--text-color-1;
+      color: #353636;
      font-weight: 600;
      display: flex;
      align-items: flex-end;
@@ -20,7 +20,7 @@
      &>span {
        font-size: 12px;
-        color: $--text-color-2;
+        color: #575757;
        font-weight: 400;
        margin-right: 3px;
      }
@@ -45,7 +45,7 @@
            .el-select__caret {
              line-height: 24px;
              width: 16px;
-              color: $--text-color-2;
+              color: #575757;
            }
          }
        }
@@ -62,14 +62,14 @@
    padding-top: 10px;
    .app-card {
-      border: 1px solid $--border-color;
+      border: 1px solid #E2E5EC;
      border-radius: 4px;
      display: flex;
      height: 100px;
      flex-direction: column;
      &.app-card--create {
-        background-color: $--block-bg-color-1;
+        background-color: #F7F7F7;
        justify-content: center;
        align-items: center;
@@ -81,7 +81,7 @@
        }
        span {
          font-size: 12px;
-          color: $--text-color-1;
+          color: #353636;
          cursor: pointer;
        }
      }
@@ -119,12 +119,12 @@
            border-radius: 2px;
            font-size: 12px;
            padding-left: 6.8px;
-            color: $--text-color-1;
+            color: #353636;
            font-weight: 400;
            i {
              margin-right: 5.67px;
              font-size: 12px;
-              color: $--text-color-2;
+              color: #575757;
            }
          }
          .app-card-title-more-delete:hover {
@@ -155,7 +155,7 @@
          display: flex;
          .app-card__body-content-number {
            font-size: 14px;
-            color: $--text-color-1;
+            color: #353636;
            font-weight: 700;
            margin-right: 6px;
          }
@@ -171,7 +171,7 @@
          justify-content: center;
          position: relative;
          top: 50%;
-          color: $--text-color-3;
+          color: #717171;
          margin-top: -10px;
          background-color: rgba(113, 113, 113, 0.12);
        }
@@ -188,12 +188,12 @@
        margin-top: -2px;
        margin-bottom: 2px;
        font-size: 12px;
-        color: $--text-color-3;
+        color: #778391;
      }
      .app-card__body-previous {
        display: flex;
        font-size: 12px;
-        color: $--text-color-1;
+        color: #353636;
        font-weight: 400;
        div:nth-of-type(1) {
          margin-right: 5px;
@@ -207,10 +207,6 @@
  .add-app-drawer {
    height: 526px !important;
    .el-drawer__body {
      padding: 0 !important;
    }
    .add-app {
      display: flex;
      flex-direction: column;
@@ -220,14 +216,14 @@
        display: flex;
        justify-content: space-between;
        height: 46px;
-        background-color: $--select-bg-color-1;
+        background-color: white;
        .header__title {
          padding-left: 20px;
          font-size: 16px;
          font-weight: bold;
          line-height: 46px;
-          color: $--text-color-1;
+          color: #353636;
        }
        .header__operations {
          display: flex;
@@ -265,12 +261,6 @@
          flex: 1;
          position: relative;
        }
        .el-tabs__item {
          display: inline-block;
        }
        .el-tabs__item:hover {
          color: #046eca;
        }
        .el-tabs__item.is-top {
          height: 50px;
          line-height: 60px;
@@ -290,25 +280,18 @@
          right: 28px;
          top: 11px;
          width: 280px;
          .el-input__wrapper {
            border-radius: 14px;
            font-size: 12px;
          .el-input.el-input--mini {
            .el-input__inner {
-                font-size: 12px !important;
+              background: #FFFFFF;
-                //background: #FFFFFF;
+              border: 1px solid #DEDEDE;
-                //border: 1px solid #DEDEDE;
+              box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
-                //box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
+              border-radius: 14px;
                //border-radius: 14px;
            }
-            }
+            &.el-input--prefix {
            .el-input__prefix-inner {
              i {
-                color: $--text-color-2;
+                color: #575757;
                font-size: 16px;
                font-weight: 600;
                margin-left: -2px;
                margin-right: 6px
              }
            }
          }
@@ -367,7 +350,7 @@
                .body__app-left-title {
                  font-family: Helvetica-Bold;
                  font-size: 16px;
-                  color: $--text-color-1;
+                  color: #353636;
                  font-weight: 700;
                  margin-bottom: 6px;
                }
@@ -392,7 +375,7 @@
            }
            .body__app-value {
              font-size: 12px;
-              color: $--text-color-3;
+              color: #717171;
              line-height: 18px;
              font-weight: 400;
              max-height: 54px;
--- a/src/assets/css/components/views/charts2/networkOverviewDdosDetection.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewDdosDetection.scss
@@ -1,11 +1,11 @@
 .ddos-detection {
  height: 100%;
-  border: 1px solid $--border-color;
+  border: 1px solid #E2E5EC;
  border-radius: 4px;
  background: rgba(113,113,113,0.06);
  .ddos-detection-title {
    font-size: 14px;
-    color: $--text-color-1;
+    color: #353636;
    font-weight: 600;
    margin-top: 15px;
    i {
@@ -34,7 +34,7 @@
        flex-direction: column;
        .ddos-detection-type-value-name {
          font-size: 12px;
-          color: $--text-color-2;
+          color: #575757;
          line-height: 12px;
          font-weight: 400;
          margin-bottom: 12px;
@@ -53,27 +53,23 @@
    .el-button {
      margin-right: 20px;
      width: 117px;
      height: 29.6px;
      min-height: 28px;
-      background: $--button-color-1;
+      background: #FBFBFB;
-      border: 1px solid $--border-color-1;
+      border: 1px solid #C5C5C5;
      box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
      border-radius: 4px;
      padding: 8px 5px;
      span {
        font-size: 12px;
-        color: $--text-color-2;
+        color: #575757;
        font-weight: 500;
        i {
-          //transform: rotate(-90deg);
+          transform: rotate(-90deg);
-          color: $--text-color-2;
+          color: #575757;
          font-size: 12px;
          margin-left: 4px;
        }
      }
      &:hover {
        background: $--button-bg-color-1 !important;
      }
    }
  }
 }
--- a/src/assets/css/components/views/charts2/networkOverviewLine.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewLine.scss
@@ -2,7 +2,7 @@
  height: 100%;
  width: 100%;
  position: relative;
-  border: 1px solid $--border-color;
+  border: 1px solid #E2E5EC;
  border-radius: 4px;
  .chart-drawing {
    height: 100%;
@@ -35,10 +35,6 @@
      display: flex;
      //flex: 1;
      .line-select__operation {
        .el-select__wrapper {
          height: 24px !important;
          min-height: 24px !important;
        }
        .el-input__inner {
          width: 100px;
        }
@@ -46,10 +42,6 @@
      .line-select-reference-line {
        margin-right: 20px;
        .line-select__operation {
          .el-select__wrapper {
            height: 24px !important;
            min-height: 24px !important;
          }
          .el-input__inner {
            width: 127px;
          }
@@ -62,36 +54,17 @@
        display: flex;
        align-items: center;
        .line-select__operation {
          min-width: 127px;
          height: 24px;
          margin-left: 3px;
          box-shadow: none;
          border-radius: 2px;
-          .el-select__wrapper {
+          .el-input__inner {
-            min-height: 24px !important;
+            padding-left: 4px;
-            //padding-left: 4px;
+            line-height: 24px;
            line-height: 24px !important;
            height: 24px;
            font-size: 12px;
-            color: $--text-color-6;
+            color: #2C72C6;
            font-weight: 400;
            padding: 5px 6px 4px 5px !important;
            .el-select__placeholder {
              color: $--text-color-6;
            }
            .el-select__suffix {
              .el-icon {
                color: #575757;
              }
            }
            //.el-input__inner {
            //  padding-left: 4px;
            //  line-height: 24px;
            //  height: 24px;
            //  font-size: 12px;
            //  color: #2C72C6;
            //  font-weight: 400;
            //}
          }
          .el-input__suffix {
            display: flex;
@@ -138,14 +111,14 @@
            .line-value-unit-number {
              font-family: Helvetica-Bold;
              font-size: 28px;
-              color: $--text-color-1;
+              color: #353636;
              margin-right: 4px;
            }
            .line-value-unit-number2 {
              font-size: 0;
              span {
                font-size: 12px;
-                color: $--text-color-2;
+                color: #575757;
                font-weight: 400;
              }
            }
--- a/src/assets/css/components/views/charts2/networkOverviewPerformanceEvent.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewPerformanceEvent.scss
@@ -1,12 +1,12 @@
 .performance-event {
  height: 100%;
-  border: 1px solid $--border-color;
+  border: 1px solid #E2E5EC;
  border-radius: 4px;
  background: rgba(113,113,113,0.06);
  .performance-event-title {
    margin-top: 15px;
    font-size: 14px;
-    color: $--text-color-1;
+    color: #353636;
    font-weight: 600;
    line-height: 1;
    i {
@@ -24,7 +24,7 @@
      height: 1px;
      width: calc(100% - 40px);
      margin: auto;
-      background: $--border-color;
+      background: #E2E5EC;
    }
    .performance-event-pie {
      position: relative;
@@ -38,30 +38,26 @@
  }
  .pie-button.el-button {
    width: 96px;
    height: 29.6px;
  }
  .el-button {
    width: 117px;
    min-height: 28px;
-    background: $--button-color-1;
+    background: #FBFBFB;
-    border: 1px solid $--border-color-1;
+    border: 1px solid #C5C5C5;
    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
    border-radius: 4px;
    padding: 8px 5px;
    margin-left: 30px;
    span {
      font-size: 12px;
-      color: $--text-color-2;
+      color: #575757;
      font-weight: 500;
      i {
-        //transform: rotate(-90deg);
+        transform: rotate(-90deg);
-        color: $--text-color-2;
+        color: #575757;
        font-size: 12px;
        margin-left: 4px;
      }
    }
    &:hover {
      background: $--button-bg-color-1 !important;
    }
  }
 }
--- a/src/assets/css/components/views/charts2/networkOverviewTabs.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewTabs.scss
@@ -52,11 +52,11 @@
        display:flex;
        flex-direction:column;
        align-items: flex-start;
-        color: $--text-color-3;
+        color: #778391;
        font-weight: 400;
        .data-column__span {
          font-weight: bold;
-          color: $--text-color-1;
+          color:#353636;
        }
        .unit__span {
          color: #778391;
@@ -66,8 +66,10 @@
      .column-loading {
        display: flex;
        flex-direction: row;
        .loading-icon {
        position:relative;
        .loading-icon {
          position:absolute;
          left: -20px;
          transform: translateZ(0) scale(0.5);
          width:20px;
          height:20px;
@@ -120,9 +122,9 @@
        }
      }
      .tab-table__average {
-        border: 1px solid $--border-color;
+        border: 1px solid #E2E5EC;
        border-radius: 4px 4px 0 0;
-        //padding: 1px;
+        padding: 1px;
        .data-click:hover{
          cursor: pointer;
        }
@@ -185,7 +187,7 @@
        height: 0px;
      }
      .el-table thead {
-        color: $--text-color-1;
+        color: $grey;
      }
      .el-table__empty-text{
        line-height:20px !important;
@@ -196,7 +198,6 @@
        justify-content: center;
        align-items: flex-start;
        line-height:18px;
        padding: 1px 10px 0 11px !important;
        .caret-wrapper {
          margin-top:3px;
        }
@@ -227,13 +228,6 @@
          background: #749F4D;
        }
      }
      .el-table__border-left-patch {
        width: 0;
      }
      .el-table__inner-wrapper::after, .el-table__inner-wrapper::before {
        width: 0;
        height: 0;
      }
    }
    .el-tabs__header {
      margin-bottom: 10px;
@@ -251,8 +245,8 @@
      }
      .el-tabs__item {
        padding: 0 10px;
-        height: 40px;
+        height: 33px;
-        color: $--text-color-1;
+        color: $grey;
        font-size: 14px;
        &.el-tabs__item.is-top.is-active {
@@ -346,153 +340,8 @@
    }
  }
 }
 .customize-tab__popper{
  max-height:405px;/*calc(100% - 136px);*/
  overflow:hidden;
  padding: 0px !important;
  background: #FFFFFF;
  /*border: 1px solid #C5C5C5;*/
  border:1px solid #C5C5C5 !important;
  box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85)!important;
  border-radius: 2px !important;
  .el-popper {
    max-height: 405px;
  }
  .el-tabs__header{
    font-size: 12px;
    color:green !important;
    font-weight: 500;
    margin: 0px ;
    border-bottom: 1px solid #E2E5EC;
    height: 30px !important;
  }
  .el-tabs__content {
    max-height: 358px !important;
    margin:8px 0 6px 0;
  }
  .el-tabs__nav{
    width:100%;
  }
  .el-tabs__nav-wrap {
    margin-bottom: 0px !important;
  }
  .el-tabs__item{
    width:50%;
    text-align:center;
    padding:0px;
    height:30px;
    line-height: 30px;
    font-size: 12px;
    color: #353636;
    font-weight: 500;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
    border-top: 3px solid #38ACD2;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item:first-child{
    border-radius: 2.5px 0 0 0;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item:last-child{
    border-radius: 0 2.5px 0 0 ;
    border-left: 1px #E2E5EC solid !important;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item{
    border-bottom: 0px ;
    border-top: 3px solid white;
    color: #353636;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__nav {
    border:0px ;
  }
  .list {
    list-style: none;
    padding-inline-start: 0px !important;
    /*height:375px;*/
    max-height: 358px !important;
    overflow:auto;
    margin:0 0;
    .drag-move {
      transition: transform 0.3s;
    }
    .list-item:last-child {
      margin-bottom: 6px;
    }
    .list-item {
      width:100%;
      color: #575757;
      margin-bottom: 0px;
      height: 24px;
      line-height: 24px;
      text-align: left;
      font-weight:400;
      font-size:12px;
      .icon-drag{
        cursor: move;
        margin-left:6px;
        margin-right:3px;
      }
      .el-checkbox__input.is-checked .el-checkbox__inner {
        width: 14px;
        height: 14px;
        background-color: #38ACD2;
        border-color: #38ACD2;
        border-radius: 2px;
      }
      .el-checkbox__input .el-checkbox__inner {
        width: 14px;
        height: 14px;
        background-color: #F2F7F9;
        border: 1px solid rgba(0,0,0,0.15);
        border-radius: 2px;
      }
      .el-checkbox__input.is-checked + .el-checkbox__label,.el-checkbox__input + .el-checkbox__label {
        font-size: 12px;
        color: #575757;
        font-weight: 400;
      }
    }
  }
  /*top:0px !important;
  right:200px !important;
  transform: translateY(126px) !important;*/
 }
 .fixed-row {
  display:flex;
  justify-content: flex-start;
  align-items: center;
  //background: white;
  background: var(--el-bg-color);
  width: 100%;
  height:40px;
  border:solid 1px $--border-color;
  //border: 1px solid var(var(--el-border-color-lighter));
  padding-left:10px !important;
  text-align: left;
  border-radius:0 0 4px 4px;
  color:#046eca;
  .fixed-button {
    display:flex;
    justify-content: center;
    padding:7px 10px;
    align-items: center;
    height: 30px;
  }
  .fixed-button:hover {
    cursor:pointer;
    background: #e6f4ff;
    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
    border-radius: 4px;
  }
 }
 .btn-up{
  margin-top:40px;
 }
 .tab-search__popper{
-  margin-top: -7px;
+  top: -7px !important;
  width:auto !important;
  max-height:206px;
  overflow:hidden;
@@ -505,10 +354,10 @@
    width:100%;
    padding: 4px 4px 0px 4px;
    .el-input__inner{
-      //padding:0px 4px;
+      padding:0px 4px;
-      //background: #FFFFFF;
+      background: #FFFFFF;
-      //border: 1px solid #C5C5C5;
+      border: 1px solid #C5C5C5;
-      //box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
+      box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
      border-radius: 2px;
      font-size: 12px;
      /*color: rgba(87,87,87,0.60);*/
@@ -556,3 +405,140 @@
    }
  }
 }
 .customize-tab__popper{
  max-height:405px;/*calc(100% - 136px);*/
  overflow:hidden;
  padding: 0px !important;
  background: #FFFFFF;
  /*border: 1px solid #C5C5C5;*/
  border:1px solid #C5C5C5 !important;
  box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85)!important;
  border-radius: 2px !important;
  .el-popper {
    max-height: 405px;
  }
  .el-tabs__header{
    font-size: 12px;
    color:green !important;
    font-weight: 500;
    margin: 0px ;
    border-bottom: 1px solid #E2E5EC;
  }
  .el-tabs__content {
    max-height: 358px !important;
    margin:8px 0 6px 0;
  }
  .el-tabs__nav{
    width:100%;
  }
  .el-tabs__nav-wrap {
    margin-bottom: 0px !important;
  }
  .el-tabs__item{
    width:50%;
    text-align:center;
    padding:0px;
    height:30px;
    line-height: 30px;
    font-size: 12px;
    color: #353636;
    font-weight: 500;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
    border-top: 3px solid #38ACD2;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item:first-child{
    border-radius: 2.5px 0 0 0;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item:last-child{
    border-radius: 0 2.5px 0 0 ;
    border-left: 1px #E2E5EC solid !important;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__item{
    border-bottom: 0px ;
    border-top: 3px solid white;
  }
  .el-tabs--card > .el-tabs__header .el-tabs__nav {
    border:0px ;
  }
  .list {
    list-style: none;
    padding-inline-start: 0px !important;
    /*height:375px;*/
    max-height: 358px !important;
    overflow:auto;
    margin:0 0;
    .drag-move {
      transition: transform 0.3s;
    }
    .list-item:last-child {
      margin-bottom: 6px;
    }
    .list-item {
      width:100%;
      color: #575757;
      margin-bottom: 0px;
      height: 24px;
      line-height: 24px;
      text-align: left;
      font-weight:400;
      font-size:12px;
      .icon-drag{
        cursor: move;
        margin-left:6px;
        margin-right:3px;
      }
      .el-checkbox__input.is-checked .el-checkbox__inner {
        background-color: #38ACD2;
        border-color: #38ACD2;
        border-radius: 2px;
      }
      .el-checkbox__input .el-checkbox__inner {
        background-color: #F2F7F9;
        border: 1px solid rgba(0,0,0,0.15);
        border-radius: 2px;
      }
      .el-checkbox__input.is-checked + .el-checkbox__label,.el-checkbox__input + .el-checkbox__label {
        font-size: 12px;
        color: #575757;
        font-weight: 400;
      }
    }
  }
  /*top:0px !important;
  right:200px !important;
  transform: translateY(126px) !important;*/
 }
 .fixed-row {
  display:flex;
  justify-content: flex-start;
  align-items: center;
  background: white;
  width: 100%;
  height:40px;
  border:solid 1px #E2E5EC;
  padding-left:10px !important;
  text-align: left;
  border-radius:0 0 4px 4px;
  color:#046eca;
  .fixed-button {
    display:flex;
    justify-content: center;
    padding:7px 10px;
    align-items: center;
    height: 30px;
  }
  .fixed-button:hover {
    cursor:pointer;
    background: #e6f4ff;
    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
    border-radius: 4px;
  }
 }
 .btn-up{
  margin-top:40px;
 }
--- a/src/assets/css/components/views/charts2/npmAppCategoryScore.scss
+++ b/src/assets/css/components/views/charts2/npmAppCategoryScore.scss
@@ -73,14 +73,11 @@
        padding: 5px 0;
        .data-column__span {
          font-size: 12px;
-          color: $--text-color-1;
+          color: #353636;
          font-weight: 600;
        }
      }
    }
    .el-table__cell {
      padding: 13px 0;
    }
    .el-table__header-wrapper .el-table__header {
      tr th:nth-last-child(-n+3) {
        text-align: center;
@@ -89,7 +86,7 @@
    .el-table__body-wrapper.is-scrolling-none {
      height: 306px !important;
      tr td {
-        padding: 13px 0 !important;
+        padding: 13px 0;
      }
      tr td:nth-last-child(-n+3) {
        text-align: center;
@@ -102,7 +99,6 @@
  .data-total {
    display: flex !important;
    .data-total-category-icon {
      margin-left: -2px;
      i {
        font-size: 16px;
        margin-right: 12px;
@@ -124,7 +120,6 @@
      width: 34px;
      line-height: 20px;
      text-align: center;
      margin-left: -2px;
    }
    .data-score.data-score-red {
      background: #E26154;
@@ -138,7 +133,6 @@
    .data-score-no-data {
      width: 34px;
      text-align: center;
      margin-left: -2px;
    }
  }
  .data-total-value {
--- a/src/assets/css/components/views/charts2/npmAppEventTable.scss
+++ b/src/assets/css/components/views/charts2/npmAppEventTable.scss
@@ -47,7 +47,7 @@
        padding: 4px 0;
        .data-column__span {
          font-size: 12px;
-          color: $--text-color-1;
+          color: #353636;
          font-weight: 600;
        }
      }
@@ -116,7 +116,4 @@
    left: 0;
    top: 32px;
  }
  .el-table .cell {
    padding: 0 10px !important;
  }
 }
--- a/src/assets/css/components/views/charts2/npmMap.scss
+++ b/src/assets/css/components/views/charts2/npmMap.scss
@@ -24,29 +24,12 @@
    position: absolute;
    right: 10px;
    top: 10px;
    display: inline-block;
    .el-select__wrapper {
      font-size: 12px;
      padding: 0;
    }
    .el-select__popper.map-select-down {
      top: 32px !important;
      .el-popper__arrow {
        display: none;
      }
    }
    .el-select__placeholder {
      padding-left: 16px;
      color: #2c72c6;
    }
    .el-select__prefix {
      padding-left: 5px;
    }
    .el-select__suffix {
      padding-right: 10px;
      padding-bottom: 2px;
    }
    .map-select {
      margin-left: 10px;
@@ -57,19 +40,6 @@
        width: 110px;
      }
    }
    .map-select__location {
      &.el-select {
        width: 222px;
      }
      .el-select__wrapper {
        min-height: 28px;
        height: 28px;
        .el-select__placeholder {
          padding-left: 4px;
          color: #c0c4cc;
        }
      }
    }
  }
  .map-legend {
    display: flex;
--- a/src/assets/css/components/views/charts2/npmRecentEvents.scss
+++ b/src/assets/css/components/views/charts2/npmRecentEvents.scss
@@ -20,36 +20,12 @@
    border: 1px solid #E2E5EC;
    border-radius: 4px;
    padding: 1px;
    .el-scrollbar__thumb {
      background: rgba(0,0,0,0);
      //width: calc(100% - 200px) !important;
    }
    .el-table__empty-block {
      width: calc(100% - 2px) !important;
    }
    .el-table__empty-text {
      line-height: 25px !important;
      .table-no-data {
        //margin-left: -2px !important;
        .icon {
          width: 30px;
          height: 30px;
          margin-left: 1px;
        }
        .table-no-data__title {
          font-size: 14px;
          color: #575757;
          font-weight: 400;
        }
      }
    }
    .el-table__header-wrapper {
      tr th {
        padding: 4px 0;
        .data-column__span {
          font-size: 12px;
-          color: $--text-color-1;
+          color: #353636;
          font-weight: 600;
        }
      }
@@ -58,6 +34,20 @@
      tr td {
        padding: 6.75px 0;
      }
      .el-table__empty-block .el-table__empty-text {
        line-height: 25px;
        .table-no-data {
          .icon {
            width: 30px;
            height: 30px;
          }
          .table-no-data__title {
            font-size: 14px;
            color: #575757;
            font-weight: 400;
          }
        }
      }
    }
  }
  .data-recent-table {
@@ -116,7 +106,4 @@
  .el-table--group::after,.el-table--border::after, .el-table::before {
    height: 0px;
  }
  .el-table .cell {
    padding: 0 10px !important;
  }
 }
--- a/src/assets/css/components/views/charts2/npmTabs.scss
+++ b/src/assets/css/components/views/charts2/npmTabs.scss
@@ -18,7 +18,6 @@
    &>.el-tabs__header {
      background-color: white;
      //background-color: #f00;
      border-color: #E2E5EC;
      .el-tabs__nav-wrap {
--- a/src/assets/css/components/views/charts2/npmTrafficLine.scss
+++ b/src/assets/css/components/views/charts2/npmTrafficLine.scss
@@ -22,22 +22,9 @@
      }
      .line-select__operation {
        height: 24px;
        min-height: 24px;
        margin-left: 3px;
        box-shadow: none;
        border-radius: 2px;
        .el-select__wrapper {
          width: 225px;
          height: 24px !important;
          min-height: 24px !important;
          padding-left: 4px;
          line-height: 24px;
          font-size: 12px;
          font-weight: 400;
          .el-select__placeholder {
            color: #2C72C6;
            margin-left: 1px;
          }
        .el-input__inner {
          width: 225px;
          height: 24px;
@@ -47,13 +34,6 @@
          color: #2C72C6;
          font-weight: 400;
        }
          .el-select__suffix {
            margin-right: -7px;
            i {
              color: #575757 !important;
            }
          }
        }
        .el-input__suffix {
          display: flex;
          .el-input__suffix-inner {
--- a/src/assets/css/components/views/charts2/panel.scss
+++ b/src/assets/css/components/views/charts2/panel.scss
@@ -21,8 +21,7 @@
      font-size: 24px;
      line-height: 24px;
      font-weight: 900;
-      //color: #353636;
+      color: #353636;
      color: $--text-color-1;
      display:flex;
      .score {
        .circle-icon {
@@ -77,7 +76,7 @@
      display: flex;
      &>.el-select {
-        width: 162px !important;
+        width: 162px;
        margin-right: 10px;
        .select-prefix {
@@ -97,22 +96,6 @@
      .panel__time {
        display: flex;
      }
      .el-select__wrapper {
        height: 28px !important;
        min-height: 20px !important;
        padding: 5px 7px 4px 5px !important;
        .el-select__prefix {
          .select-prefix {
            margin-right: -5px !important;
          }
        }
        .el-select__suffix {
          .el-icon {
            margin-left: -17px !important;
            margin-top: -2px !important;
          }
        }
      }
    }
  }
  .chart-list {
--- a/src/assets/css/components/views/detections/detection-create/detection-form-setting.scss
+++ b/src/assets/css/components/views/detections/detection-create/detection-form-setting.scss
@@ -1,17 +1,6 @@
 .form-setting__block {
  width: 620px;
  &.el-form-item {
    margin-bottom: 20px;
    margin-top: -4px;
  }
  .el-select__wrapper, .el-input__wrapper {
    min-height: 24px !important;
    height: 24px !important;
  }
  .el-switch__label.is-active {
    color: $--text-color-1;
  }
  .el-form-item__label {
    height: 14px;
    line-height: 14px;
--- a/src/assets/css/components/views/detections/detection-create/detection-form.scss
+++ b/src/assets/css/components/views/detections/detection-create/detection-form.scss
@@ -135,16 +135,6 @@
        .el-collapse-item__content {
          padding-bottom: 0 !important;
        }
        .el-input__wrapper, .el-select__wrapper {
          height: 24px !important;
          line-height: 24px !important;
          min-height: 24px !important;
          width: 112px;
          margin: 0 12px;
        }
        .el-input__inner {
          padding: 0 15px !important;
        }
      }
    }
--- a/src/assets/css/components/views/detections/detection-filter.scss
+++ b/src/assets/css/components/views/detections/detection-filter.scss
@@ -130,10 +130,7 @@
 }
 .new-detection-filter-content {
  padding: 20px;
-  .el-checkbox {
+
    display: inline-block !important;
    height: auto !important;
  }
  .new-filter-content-title {
    font-family: NotoSansHans-Medium;
    font-size: 14px;
@@ -148,12 +145,11 @@
    .new-filter-content-checkbox {
      line-height: 16px;
-      margin-bottom: 13.6px;
+      margin-bottom: 10px;
      font-family: NotoSansSChineseRegular;
      font-size: 14px;
      color: #353636;
      font-weight: 400;
      display: flex !important;
      .el-checkbox__inner {
        width: 16px !important;
@@ -189,7 +185,6 @@
        font-size: 14px;
        color: #353636;
        font-weight: 400;
        padding-left: 10px !important;
      }
    }
  }
--- a/src/assets/css/components/views/detections/detection-table.scss
+++ b/src/assets/css/components/views/detections/detection-table.scss
@@ -1,10 +1,4 @@
 .detection-table {
  .el-table td, .el-table th {
    padding: 12px 0;
  }
  .el-table .el-table__cell.is-center {
    padding-top: 4px;
  }
  .el-table th > .cell, .el-table .cell {
    padding-left: 0 !important;
    padding-right: 0 !important;
--- a/src/assets/css/components/views/detections/detection-tools.scss
+++ b/src/assets/css/components/views/detections/detection-tools.scss
@@ -129,10 +129,6 @@
    .el-input--small {
      line-height: 27px;
      .el-input__wrapper {
        height: 28px !important;
        border-radius: 2px 0 0 2px !important;
      }
      .el-input__inner {
        height: 28px;
--- a/src/assets/css/components/views/entityExplorer/entity-explorer.scss
+++ b/src/assets/css/components/views/entityExplorer/entity-explorer.scss
@@ -90,8 +90,6 @@
    font-size: 14px;
    color: #353636;
    font-weight: 400;
    height: 20.8px;
    line-height: 20.8px;
    .entity-hide-entity {
      margin-left: 20px;
--- a/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss
+++ b/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss
@@ -64,7 +64,6 @@
          i {
            color: #23BF9A;
            margin-right: 4px;
            margin-top: 2px;
          }
        }
--- a/src/assets/css/components/views/entityExplorer/search/explorer-search.scss
+++ b/src/assets/css/components/views/entityExplorer/search/explorer-search.scss
@@ -161,9 +161,6 @@
              padding-left: 18px;
            }
          }
          .el-scrollbar__bar {
            visibility: hidden;
          }
        }
        .clear-all {
          padding-left: 18px;
--- a/src/assets/css/components/views/report/report.scss
+++ b/src/assets/css/components/views/report/report.scss
@@ -78,37 +78,11 @@
              color: #1b2e3b;
              background: #ebeef5;
            }
            .el-range-editor--small.el-input__wrapper {
              height: 32px;
              line-height: 32px;
            }
            .cn-detection__footer {
              text-align: center;
              display: flex;
              justify-content: center;
              .el-pagination__jump {
                margin-left: 3px;
              }
              .el-pagination__goto {
                display: none;
              }
              .el-input--small {
                width: 46px !important;
                .el-input__wrapper {
                  height: 22px;
                }
              }
              .el-pagination--small {
                .btn-prev {
                  margin-right: 10px;
                }
                .btn-next {
                  margin-left: 10px;
                }
                &span {
                  color: $--color-text-primary;
                }
              }
            }
          }
          .block.drop-down-time {
@@ -202,12 +176,6 @@
            }
          }
        }
        .el-table__border-left-patch, .el-table--border::before {
          width: 0;
        }
        .el-table--border .el-table__inner-wrapper::after, .el-table__inner-wrapper::before {
          height: 0;
        }
      }
    }
    .table-operation-all {
--- a/src/assets/css/components/views/setting/knowledgeBase.scss
+++ b/src/assets/css/components/views/setting/knowledgeBase.scss
@@ -169,8 +169,6 @@
              align-items: center;
              .card-title-name {
                width:100%;
                height: 19.2px;
                line-height: 19.2px;
                overflow: hidden; //超出的文本隐藏
                text-overflow: ellipsis; //溢出用省略号显示
                white-space:nowrap;
@@ -998,10 +996,6 @@
    padding-left: 20px;
    overflow: auto;
    .el-form--label-top .el-form-item .el-form-item__label {
      margin-bottom: 3px !important;
    }
    .enable-form__mt {
      .el-form {
        margin-top:6px;
@@ -1182,7 +1176,6 @@
        }
        .el-textarea__inner {
          padding-left: 8px;
          font-size: 12px;
        }
        .form-select__disable {
@@ -1195,13 +1188,6 @@
        .form-select__enable {
          width: 100%;
          .el-select__wrapper {
            //padding-left: 22px !important;
            .el-select__inner {
              background-color: #521919 !important;
              padding-left: 22px !important;
            }
          }
          .el-input__inner {
            background-color: white !important;
            padding-left: 22px !important;
@@ -1913,7 +1899,6 @@
    padding-top:0px;
    padding-right:30px;
    padding-left:30px;
    padding-bottom:30px;
    .dialog-message {
      padding-left:0px !important;
      padding-right:0px !important;
@@ -1935,21 +1920,12 @@
      &.update-dialog__table--system-user {
        height: calc(100% - 139px);
      }
      &.el-table .el-table__cell {
        padding: 12px 0 !important;
      }
      &.el-table .el-table__row .el-table__cell {
        padding: 8px 0 !important;
      }
    }
    .update-knowledge-form {
      .el-upload {
        width:100%;
      }
      .form-input {
        .el-input__wrapper {
          padding: 1px 16px !important;
        }
        .el-input__inner{
          padding-right: 50px !important;
          font-size: 14px;
@@ -1960,8 +1936,7 @@
        border: 1px solid rgba(222,222,222,1);
        box-shadow: 0px 2px 4px 0px rgba(51,51,51,0.02);
        border-radius: 2px;
-        //width:100%;
+        width:100%;
        width: 1020px;
        height:28px;
        min-height:28px !important;
        color: #575757;
@@ -1987,16 +1962,6 @@
      }
      .knowledge-remark {
        margin-bottom:0px !important;
        .el-textarea__inner {
          font-size: 12px;
          padding: 5px 15px;
        }
      }
      .el-form--label-top .el-form-item .el-form-item__label {
        margin-bottom: 0 !important;
      }
      .el-form--default.el-form--label-top .el-form-item .el-form-item__label {
        line-height: 14px;
      }
    }
    .dialog-footer {
--- a/src/assets/css/components/views/system/Plugin.scss
+++ b/src/assets/css/components/views/system/Plugin.scss
@@ -1,3 +1,17 @@
 .plugin-management .list-page {
  .cn-table {
    height: 100%;
    .el-table {
      height: 100%;
    }
    .el-table--group::after,.el-table--border::after, .el-table::before {
      height: 0;
    }
  }
  .cn-pagination {
    display: none;
  }
 }
 .plugin {
  font-size: 12px;
  color: #353636;
@@ -10,6 +24,7 @@
    color: #046ECA;
    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
    border-radius: 12px;
    margin-right:10px;
  }
  .plugin-name {
    display: flex;
@@ -43,7 +58,4 @@
    -webkit-line-clamp: 2; // 超出多少行
    -webkit-box-orient: vertical;
  }
  .cn-table .el-table:not(.chart-table) td {
    padding: 8px 0 !important;
  }
 }
--- a/src/assets/css/font/iconfont.css
+++ b/src/assets/css/font/iconfont.css
@@ -1,8 +1,8 @@
@font-face {
  font-family: "cn-icon"; /* Project id 2614877 */
-  src: url('iconfont.woff2?t=1703561754372') format('woff2'),
+  src: url('iconfont.woff2?t=1706606024800') format('woff2'),
-       url('iconfont.woff?t=1703561754372') format('woff'),
+       url('iconfont.woff?t=1706606024800') format('woff'),
-       url('iconfont.ttf?t=1703561754372') format('truetype');
+       url('iconfont.ttf?t=1706606024800') format('truetype');
 }
 .cn-icon {
@@ -13,6 +13,26 @@
  -moz-osx-font-smoothing: grayscale;
 }
 .cn-icon-license:before {
  content: "\e666";
 }
 .cn-icon-base-station:before {
  content: "\e6cf";
 }
 .cn-icon-home:before {
  content: "\e6d0";
 }
 .cn-icon-company:before {
  content: "\e6d1";
 }
 .cn-icon-pedestrian:before {
  content: "\e6d2";
 }
 .cn-icon-system:before {
  content: "\e6cc";
 }
@@ -373,7 +393,7 @@
  content: "\e7b4";
 }
-.cn-icon-a-GeneralSettings:before {
+.cn-icon-general-setting:before {
  content: "\e7b5";
 }
--- a/src/assets/css/font/iconfont.js
+++ b/src/assets/css/font/iconfont.js
--- a/src/assets/css/font/iconfont.ttf
+++ b/src/assets/css/font/iconfont.ttf
--- a/src/assets/css/font/iconfont.woff
+++ b/src/assets/css/font/iconfont.woff
--- a/src/assets/css/font/iconfont.woff2
+++ b/src/assets/css/font/iconfont.woff2
--- a/src/assets/css/main.scss
+++ b/src/assets/css/main.scss
@@ -27,20 +27,18 @@ $--font-path: '~@/assets/css/themes/src/fonts'; // 避免ele原字体加载语
 /* 主题 */
-$--color-text-primary: #303133 !default;
+.theme-light {
-$--border-color: #E2E5EC;
+  $--theme: light;
  @import './themes/theme-light.scss'; // 加载主题变量
  @import './themes/src/index.scss'; // 加载ele样式
  @import './components/index'; // 加载cn组件样式
  @import './common/index.scss'; // 加载通用样式
-@import "common/cover-element-plus"; // 覆盖新版elemen-plus样式
+}
-.dark {
+.theme-dark {
  $--theme: dark;
  @import './themes/theme-dark.scss'; // 加载主题变量
  @import './themes/src/index.scss'; // 加载ele样式
  @import './components/index'; // 加载cn组件样式
  @import './common/index.scss'; // 加载通用样式
  .fixed-button:hover {
    background: #40474b !important;
  }
 }
--- a/src/assets/css/themes/THEME_README.md
+++ b/src/assets/css/themes/THEME_README.md
@@ -11,23 +11,3 @@
 - theme-chalk/src/mixins/mixins.scss 改动较多，如需了解请比对文件差异
 -   // $arrow-selector: #{& + '__arrow'};   
    改为 $arrow-selector: '.el-popper__arrow';
 ### 20240118__element-plus升级
 #### 变动事项
 - elemen-plus由1.0.2-beta.71升级至2.5.1，旧版本是将element-plus源文件放到theme/src中进行部分修改使用，现在弃用该方案，直接使用element-plus组件，部分组件有差异改动，对比界面进行调整并记录在cover-element.scss
 - 弃用之前的主题写法，改为官网的主题切换方法。删除body上的class，在html上添加class="dark"。默认明亮主题light，暗黑主题dark，默认引入theme-light.scss样式文件，暗黑主题theme-dark.scss样式文件
 - 如需添加暗黑样式，先在theme-light.scss添加唯一样式名，再到theme-dark中添加同名样式。如在light中添加字体颜色$--text-color-1: #353636;，则需要在dark中添加$--text-color-1: #d8d8d8;
 - header.vue的第四级面包屑导航栏，以及NetworkOverviewTabs.vue第一列搜索的popover。原结构的popover被上一层div包裹，但在html中解析成两个div，原来的popper-class需要提出来，不要在原div的class下，否则样式错乱
 #### 新旧组件差异
 - table表格：自定义单元格样式cell-style。老版cell-style接受格式为string/object，新版疑似仅接受object，string格式会报错。表头格式header-cell-style同理。
 - input输入框1：老版el-input是包含class为el-input__inner的input，新版el-input在此基础上被class="el-input__wrapper"的div包裹。在老版的el-input__inner改动的样式，需要在el-input__wrapper上修改
 - input输入框2：老版给input添加icon，是给属性prefix-icon添加icon名。新版是在prefix插槽里添加icon标签
 - icon图标：老版使用：<i class="el-icon-search" />。新版则是svg文件，需要单独引入封装成component的格式，使用时：<el-icon><Search /></el-icon>
 - select选择器：新版被el-select__wrapper的div包裹，与旧版顺序不同。
 - * input和select的右侧图标和maxlength间距新版比旧版略大
 - drawer抽屉：在header.vue中遇到，custom-class="cn-menu"，渲染后class中没有cn-menu，也许是按需引入导致的，额外标注
 - message-box弹窗：新版在旧版的el-message-box的外层包裹了一层父div el-overlay-message-box，导致原样式会错乱
 - dialog: custom在2.4版本后被移除，使用class替代，插槽中的title也在2.4版本后移除，使用header替代
--- a/src/assets/css/themes/theme-dark.scss
+++ b/src/assets/css/themes/theme-dark.scss
@@ -60,23 +60,3 @@ $--border-color-light: #E7EAED;
 $--chart-box-border-color: $--border-color-light;
 $--chart-title-hover-background-color: #323238;
@import './common';
 $--border-color: #363637;
 $--text-color-1: #d8d8d8;
 $--text-color-2: #afafaf;
 $--text-color-3: #a4adb7;
 $--text-color-4: #BEBEBE;
 $--text-color-5: #D8D8D8;
 $--text-color-6: #2764ad;
 $--button-color-1: #1D1D1D;
 $--button-bg-color-1: #303030;
 $--border-color-1: var(--el-text-color-disabled);
 $--border-color-2: #6C6E72;
 $--select-bg-color-1: #1D1E1F;
 $--select-bg-color-hover-1: #18222C;
 $--select-bg-color-hover-2: #18222C;
 $--block-bg-color-1: #181818;
--- a/src/assets/css/themes/theme-light.scss
+++ b/src/assets/css/themes/theme-light.scss
@@ -61,22 +61,3 @@ $--border-color-light: #E7EAED;
 $--chart-box-border-color: $--border-color-light;
 $--chart-title-hover-background-color: $--background-color-1;
@import './common';
 $--text-color-1: #353636;
 $--text-color-2: #575757;
 $--text-color-3: #778391;
 $--text-color-4: #666666;
 $--text-color-5: #333333;
 $--text-color-6: #2C72C6;
 $--button-color-1: #FBFBFB;
 $--button-bg-color-1: #EBF1F4;
 $--border-color-1: #C5C5C5;
 $--border-color-2: #E2E5EC;
 $--border-color-3: #DEDEDE;
 $--select-bg-color-1: #FFFFFF;
 $--select-bg-color-hover-1: #f9f9f9;
 $--select-bg-color-hover-2: #F2F9FF;
 $--block-bg-color-1: #F7F7F7;
--- a/src/components/advancedSearch/TagMode.vue
+++ b/src/components/advancedSearch/TagMode.vue
@@ -7,13 +7,9 @@
    >
      <template v-if="meta.meta === condition">
        <!-- 删除按钮 -->
-        <div class="condition__delete" @click="removeCondition(index)">
+        <div class="condition__delete" @click="removeCondition(index)"><i class="el-icon-error"></i></div>
          <el-icon><CircleCloseFilled /></el-icon>
          <!--<i class="el-icon-error"></i>-->
        </div>
        <!-- 字段选择 -->
        <div v-if="meta.column.show" class="condition__column">
 <!--          <div>-->
          <div v-show="meta.column.isEditing">
            <el-select
                allow-create
@@ -159,12 +155,10 @@
        </el-popover>
      </span>
      <span v-show="metaList.length>0" class="search__suffix search__suffix-close" @click="cleanMetaList">
-        <el-icon><CircleCloseFilled /></el-icon>
+        <i class="el-icon-error"></i>
        <!--<i class="el-icon-error"></i>-->
      </span>
      <span test-id="tag-search" class="search__suffix" @click="search">
-        <el-icon><Search /></el-icon>
+        <i class="el-icon-search"></i>
        <!--<i class="el-icon-search"></i>-->
      </span>
    </div>
  </div>
--- a/src/components/advancedSearch/TextMode.vue
+++ b/src/components/advancedSearch/TextMode.vue
@@ -11,7 +11,7 @@
        <el-popover
            popper-class="my-popper-class"
            placement="top"
-            trigger="click"
+            trigger="hover"
            :content="$t('overall.switchToTag')"
        >
          <template #reference>
@@ -21,13 +21,11 @@
      </span>
      <!--删除图标-->
      <span v-show="isCloseIcon" class="search__suffix search__suffix-close" @click="cleanParams">
-        <el-icon><CircleCloseFilled /></el-icon>
+        <i class="el-icon-error"></i>
        <!--<i class="el-icon-error"></i>-->
      </span>
      <!--搜索图标-->
      <span class="search__suffix" test-id="text-search" @click.stop="search">
-        <el-icon><Search /></el-icon>
+        <i class="el-icon-search"></i>
        <!--<i class="el-icon-search"></i>-->
      </span>
    </div>
--- a/src/components/advancedSearch/meta/parser.js
+++ b/src/components/advancedSearch/meta/parser.js
@@ -1135,12 +1135,12 @@ export default class Parser {
        }
        return returnObj
-      } else if (q.indexOf(' LIKE ') > -1 || q.indexOf(' like ') > -1) {
+      } else if (q.toLowerCase().indexOf(' like ') > -1) {
        return {
          key: q,
          isKey: true
        }
-      } else if (q.indexOf(' IN ') > -1 || q.indexOf(' in ') > -1) {
+      } else if (q.toLowerCase().indexOf(' in ') > -1) {
        return {
          key: q,
          isKey: true
@@ -1154,15 +1154,79 @@ export default class Parser {
          return { key: '[' + key + ']', isKey: false }
        }
      }
-    } else if (q && (q.indexOf(' IN ') > -1 || q.indexOf(' in ') > -1 || q.indexOf(' LIKE ') > -1 || q.indexOf(' like ') > -1)) {
+    } else if (q && (q.toLowerCase().indexOf(' in ') > -1 || q.toLowerCase().indexOf(' like ') > -1 || q.toLowerCase().indexOf('has(') > -1)) {
-      return {
+      const lowerQ = q.toLowerCase()
-        key: q,
+      if (lowerQ.indexOf(' and ') > -1) {
-        isKey: true
+        if (this.checkStrIncludeAnd(q)) {
          q = q.replace(/ and /g, ' AND ')
        }
        const arr = q.split(' AND ')
        for (let i = 0; i < arr.length; i++) {
          const item = arr[i].toLowerCase()
          if (item.indexOf(' like ') > -1) {
            const key = item.substring(0, item.indexOf(' like '))
            const obj = this.columnList.find(t => t.label.toLowerCase() === key.toLowerCase())
            if (!obj) {
              return { key: '[' + key + ']', isKey: false }
            }
          } else if (item.indexOf(' in ') > -1) {
            const key = q.substring(0, q.indexOf(' in '))
            const obj = this.columnList.find(t => t.label.toLowerCase() === key.toLowerCase())
            if (!obj) {
              return { key: '[' + key + ']', isKey: false }
            }
          } else if (item.indexOf('has(') > -1) {
            const key = item.substring(0, 4)
            if (key === 'has(') {
              const label = item.substring(4, item.indexOf(','))
              if (label) {
                const obj = this.columnList.find(t => t.label.toLowerCase() === label.toLowerCase())
                if (!obj) {
                  return { key: '[' + key + ']', isKey: false }
                }
              } else {
                return { key: 'in index ' + q.indexOf('has('), isKey: false }
              }
            } else {
              return { key: 'in index ' + q.indexOf('has('), isKey: false }
            }
          }
        }
        return { key: q, isKey: true }
      } else if (lowerQ.indexOf(' like ') > -1) {
        const key = q.substring(0, q.indexOf(' like '))
        const obj = this.columnList.find(t => t.label.toLowerCase() === key.toLowerCase())
        if (obj) {
          return { key: obj.label + q.substring(lowerQ.indexOf(' like '), q.length), isKey: true }
        } else {
          return { key: '[' + key + ']', isKey: false }
        }
      } else if (lowerQ.indexOf(' in ') > -1) {
        const key = lowerQ.substring(0, lowerQ.indexOf(' in '))
        const obj = this.columnList.find(t => t.label.toLowerCase() === key.toLowerCase())
        if (obj) {
          return { key: obj.label + q.substring(lowerQ.indexOf(' in '), q.length), isKey: true }
        } else {
          return { key: '[' + key + ']', isKey: false }
        }
      } else if (lowerQ.indexOf('has(') > -1) {
        const key = lowerQ.substring(0, 4)
        if (key === 'has(') {
          const label = lowerQ.substring(4, lowerQ.indexOf(','))
          if (label) {
            const obj = this.columnList.find(t => t.label.toLowerCase() === label.toLowerCase())
            if (obj) {
              return { key: 'has(' + obj.label + q.substring(lowerQ.indexOf(','), lowerQ.length), isKey: true }
            } else {
              return { key: '[' + key + ']', isKey: false }
            }
          } else {
            return { key: 'in index 5', isKey: false }
          }
        } else {
          return { key: 'in index 5', isKey: false }
        }
    } else if (q && (q.indexOf('has(') > -1)) {
      return {
        key: q,
        isKey: true
      }
    } else {
      return {
@@ -1257,6 +1321,10 @@ export default class Parser {
        })
        return str
      } else if (!result) {
        // 此处为不能识别的字段，不能当成app处理
        if (str.indexOf('=') > -1 || str.toLowerCase().indexOf(' in ') > -1 || str.toLowerCase().indexOf(' like ') > -1 || str.toLowerCase().indexOf('has(') > -1) {
          return str
        }
        const regex = /^["']|["']$/
        // 去除两侧引号，如'1.1.1.1',避免校验时被当作app
        if (regex.test(str)) {
@@ -1285,7 +1353,7 @@ export default class Parser {
    }
    if (regexIPv4.test(str) || regexIPv6.test(str)) {
-      const obj = this.columnList.find(t => t.label.toLowerCase() === 'ip')
+      const obj = this.columnList.find(t => t.label.toLowerCase() === 'ip' || t.label.toLowerCase() === 'ip.addr')
      if (obj) {
        return `${obj.label}='${str}'`
      } else {
@@ -1296,7 +1364,7 @@ export default class Parser {
      }
    } else if (regexDomain.test(str)) {
      // 只写作domain即可，schema字段更改几次，避免后续再更改，直接拿this.columnList的label进行替换
-      const obj = this.columnList.find(t => t.label.toLowerCase() === 'domain')
+      const obj = this.columnList.find(t => t.label.toLowerCase() === 'domain' || t.label.toLowerCase() === 'domain.name')
      if (obj) {
        return `${obj.label} LIKE '%${str}'`
      } else {
@@ -1306,7 +1374,7 @@ export default class Parser {
        return str
      }
    } else {
-      const obj = this.columnList.find(t => t.label.toLowerCase() === 'app')
+      const obj = this.columnList.find(t => t.label.toLowerCase() === 'app' || t.label.toLowerCase() === 'app.name')
      if (obj) {
        return `${obj.label} LIKE '%${str}%'`
      } else {
--- a/src/components/common/popBox/TopToolMoreOptions.vue
+++ b/src/components/common/popBox/TopToolMoreOptions.vue
@@ -29,7 +29,7 @@
                     action=""
                     class="upload-demo"
                     drag>
-            <el-icon><UploadFilled /></el-icon>
+            <i class="el-icon-upload"></i>
            <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
            <template #tip>
              <div class="el-upload__tip" >
--- a/src/components/layout/Header.vue
+++ b/src/components/layout/Header.vue
@@ -35,12 +35,6 @@
              <el-dropdown-item>
                <div id="header-to-logout" @click="logout">{{ $t('overall.logout') }}</div>
              </el-dropdown-item>
 <!--              <el-dropdown-item>-->
 <!--                <div id="header-to-theme" @click="switchTheme">-->
 <!--                  <span>暗黑模式</span>-->
 <!--                  <el-switch v-model="isDark" size="large" class="mt-2" style="margin-left: 24px" inline-prompt />-->
 <!--                </div>-->
 <!--              </el-dropdown-item>-->
            </el-dropdown-menu>
          </template>
        </el-dropdown>
@@ -52,9 +46,8 @@
        <el-breadcrumb-item class="header__left-breadcrumb-item" :id="`breadcrumb${item.value}`" :title="index===3?item.value:''"
                            v-for="(item,index) in breadcrumb" :key="item.value">
          <template v-if="index===3" >
-            <div class="header__left-breadcrumb-item-select" style="position: relative">
+            <div class="header__left-breadcrumb-item-select" >
              <el-popover placement="bottom-start"
                          style="position: absolute"
                          ref="breadcrumbPopover"
                          :show-arrow="false"
                          :append-to-body="false"
@@ -135,7 +128,6 @@
        direction="ttb"
        custom-class="cn-menu"
        modal-class="cn-menu-modal"
        class="cn-menu"
        :with-header="false"
        :show-close="false"
    >
@@ -230,7 +222,6 @@ import {
 import { getNowTime, getSecond } from '@/utils/date-util'
 import _ from 'lodash'
 import { useRoute } from 'vue-router'
 import { useDark, useToggle } from '@vueuse/core'
 export default {
  name: 'Header',
@@ -316,8 +307,7 @@ export default {
      wholeScreenRouterMapping,
      logo: 'images/logo-header.svg',
      ZH,
-      EN,
+      EN
      isDark: useDark()
    }
  },
  computed: {
@@ -484,16 +474,10 @@ export default {
      this.showChangePin = true
    },
    logout () {
      //
      sessionStorage.removeItem(storageKey.tokenExpireCurrentPath)
      localStorage.removeItem(storageKey.token)
      axios.get(api.logout)
    },
    switchTheme () {
      useToggle(this.isDark)
      const theme = this.isDark ? 'light' : 'dark'
      localStorage.setItem(storageKey.theme, theme)
    },
    refreshLang () {
      this.language = localStorage.getItem(storageKey.language)
      this.$i18n.locale = this.language
--- a/src/components/rightBox/report/ReportBox.vue
+++ b/src/components/rightBox/report/ReportBox.vue
@@ -190,6 +190,7 @@
                    :format="dateFormat"
                    prefix-icon="cn-icon cn-icon-shijian"
                    type="datetime"
                    @change="onChangeSchedulerStart"
                    placeholder=" "
                />
              </div>
@@ -206,6 +207,7 @@
                    :format="dateFormat"
                    prefix-icon="cn-icon cn-icon-shijian"
                    type="datetime"
                    @change="onChangeSchedulerEnd"
                    placeholder=" "
                />
              </div>
@@ -242,7 +244,7 @@
                         placeholder=" "
                         filterable
                         :disabled="!!editObject.id"
-                         popper-class="right-box-select-dropdown right-box-select-report "
+                         popper-class="search-select right-box-select-dropdown right-box-select-report "
                         size="small"
              >
                <template #prefix>
@@ -276,7 +278,7 @@ import { storageKey, report } from '@/utils/constants'
 import { api } from '@/utils/api'
 import _ from 'lodash'
 import axios from 'axios'
-import { dateFormat, getMillisecond } from '@/utils/date-util'
+import { dateFormat, getMillisecond, millTimestampDiffFromTz } from '@/utils/date-util'
 import { ref, getCurrentInstance } from 'vue'
 import i18n from '@/i18n'
 export default {
@@ -292,10 +294,12 @@ export default {
    const startTime = ref('')
    const endTime = ref('')
    function endTimeChange (val) {
-      endTime.value = val
+      // endTime.value = val + millTimestampDiffFromTz()
      endTime.value = getMillisecond(val) + millTimestampDiffFromTz()
    }
    function startTimeChang (val) {
-      startTime.value = val
+      // startTime.value = val + millTimestampDiffFromTz()
      startTime.value = getMillisecond(val) + millTimestampDiffFromTz()
    }
    const endDisabledDate = (time) => {
      if (time.getTime() > new Date()) {
@@ -332,7 +336,7 @@ export default {
    }
    const startTimeValidator = (rule, value, callback) => {
      const form = proxy.$refs.reportForm
-      if (form.model.config.endTime) {
+      if (form.model && form.model.config && form.model.config.endTime) {
        form.validateField('config.endTime', () => null)
      }
      callback()
@@ -352,9 +356,6 @@ export default {
      categoryId: [
        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' }
      ],
      schedulerStart: [
        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' }
      ],
      'config.startTime': [
        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' },
        { validator: startTimeValidator, trigger: 'change' }
@@ -368,15 +369,53 @@ export default {
        { validator: paramValidator, message: i18n.global.t('validate.required'), trigger: 'blur' }
      ]
    }
    const mySchedulerStart = ref('')
    const mySchedulerEnd = ref('')
    const onChangeSchedulerStart = (val) => {
      mySchedulerStart.value = getMillisecond(val) + millTimestampDiffFromTz()
    }
    const onChangeSchedulerEnd = (val) => {
      mySchedulerEnd.value = getMillisecond(val) + millTimestampDiffFromTz()
    }
    return {
      endDisabledDate,
      startDisabledDate,
      startTimeChang,
      endTimeChange,
-      rules
+      rules,
      startTime,
      endTime,
      mySchedulerStart,
      mySchedulerEnd,
      onChangeSchedulerStart,
      onChangeSchedulerEnd
    }
  },
  data () {
    const schedulerStartTimeValidator = (rule, value, callback) => {
      if (this.editObject.schedulerEnd) {
        if (this.$refs.reportForm) {
          this.$refs.reportForm.validateField('schedulerEnd')
        }
      }
      callback()
    }
    const schedulerEndTimeValidator = (rule, value, callback) => {
      if (value && this.editObject.schedulerStart && (getMillisecond(this.editObject.schedulerStart) >= getMillisecond(value))) {
        callback(new Error(this.$t('config.user.timeVerification')))
      } else {
        callback()
      }
    }
    this.rules.schedulerStart = [
      { required: true, message: i18n.global.t('validate.required'), trigger: 'change' },
      { validator: schedulerStartTimeValidator, trigger: 'change' }
    ]
    this.rules.schedulerEnd = [
      { validator: schedulerEndTimeValidator, trigger: 'change' }
    ]
    return {
      url: api.reportTemp,
@@ -403,7 +442,9 @@ export default {
      monthWeekdayCheckedAll: false,
      monthWeekdayIsIndeterminate: false,
-      paramsOptions: []
+      paramsOptions: [],
      newParamsOptions: [],
      rangeNumber: 10
    }
  },
  watch: {
@@ -414,6 +455,7 @@ export default {
    scheduleChecked (n) {
      this.editObject.config.isScheduler = n ? 1 : 0
      this.cleanScheduleConfig()
      this.initDateCalendarPreIcon()
    },
    monthScheduleType (n) {
      this.cleanScheduleConfig()
@@ -495,6 +537,14 @@ export default {
          }
        }
        if (n.config) {
          if (n.config.startTime) {
            this.editObject.config.startTime = getMillisecond(n.config.startTime) - millTimestampDiffFromTz()
          }
          if (n.config.endTime) {
            this.editObject.config.endTime = getMillisecond(n.config.endTime) - millTimestampDiffFromTz()
          }
        }
        if (n.schedulerStart) {
          this.editObject.schedulerStart = dateFormat(this.editObject.schedulerStart, this.dateFormat)
        }
@@ -521,10 +571,24 @@ export default {
      }
    }
  },
  mounted () {
    this.initDateCalendarPreIcon()
  },
  methods: {
    initDateCalendarPreIcon () {
      this.$nextTick(() => {
        const datePrefixIcon = document.getElementsByClassName('el-input__prefix-inner')
        if (datePrefixIcon && datePrefixIcon.length > 0) {
          Array.prototype.forEach.call(datePrefixIcon, function (element) {
            element.innerHTML = '<i class="el-input__icon cn-icon cn-icon-shijian"></i>'
          })
        }
      })
    },
    loadParamOptions () {
      if (_.isArray(this.editObject.categoryParams) && !_.isEmpty(this.editObject.categoryParams)) {
        this.editObject.categoryParams.forEach(param => {
          // this.paramsOptions = _.cloneDeep(this.newParamsOptions)
          if (!this.paramsOptions.some(p => p.key === param.key)) {
            axios.get(api.dict, { params: { type: param.key, pageSize: -1 } }).then(response => {
              if (response.status === 200) {
@@ -532,6 +596,7 @@ export default {
                  key: param.key,
                  options: response.data.data.list.map(d => d.value)
                })
                // this.newParamsOptions = this.paramsOptions
              }
            })
          }
@@ -569,6 +634,7 @@ export default {
      if (val === 'customize') {
        this.scheduleChecked = false
      }
      this.initDateCalendarPreIcon()
    },
    scheduleTypeChange (val) {
      this.scheduleType = val
@@ -584,10 +650,12 @@ export default {
          let schedulerStart = ''
          let schedulerEnd = ''
          if (this.editObject.config && this.editObject.config.startTime) {
-            startTime = getMillisecond(this.editObject.config.startTime)
+            // startTime = getMillisecond(this.editObject.config.startTime)
            startTime = this.startTime ? this.startTime : this.object.config.startTime
          }
          if (this.editObject.config && this.editObject.config.endTime) {
-            endTime = getMillisecond(this.editObject.config.endTime)
+            // endTime = getMillisecond(this.editObject.config.endTime)
            endTime = this.endTime ? this.endTime : this.object.config.endTime
          }
          if (this.editObject.config && this.editObject.config.schedulerConfig) {
            if (['day', 'week', 'month'].indexOf(this.editObject.config.schedulerConfig.type) > -1) {
@@ -597,10 +665,12 @@ export default {
            }
          }
          if (this.editObject.schedulerStart) {
-            schedulerStart = getMillisecond(this.editObject.schedulerStart)
+            // schedulerStart = getMillisecond(this.editObject.schedulerStart)
            schedulerStart = this.mySchedulerStart ? this.mySchedulerStart : this.object.schedulerStart
          }
          if (this.editObject.schedulerEnd) {
-            schedulerEnd = getMillisecond(this.editObject.schedulerEnd)
+            // schedulerEnd = getMillisecond(this.editObject.schedulerEnd)
            schedulerEnd = this.mySchedulerEnd ? this.mySchedulerEnd : this.object.schedulerEnd
          }
          const copyObject = _.cloneDeep(this.editObject)
@@ -721,6 +791,36 @@ export default {
      const checkedCount = val.length
      this.monthWeekdayCheckedAll = checkedCount === this.weekdayList.length
      this.monthWeekdayIsIndeterminate = checkedCount > 0 && checkedCount < this.weekdayList.length
    },
    /**
     * params的option筛选方法，组件自带的方法在paramsOptions的options长度超过1512后会保留部分值
     * @param filterVal
     */
    filterMethod (filterVal) {
      const key = this.editObject.categoryParams[0].key
      if (filterVal) {
        const obj = this.newParamsOptions.find(d => d.key === key)
        if (_.isString(filterVal) && obj) {
          const filterArr = _.cloneDeep(obj.options).filter(d => d.toLowerCase().includes(filterVal.toLowerCase()))
          const paramsOptionsObj = this.paramsOptions.find(d => d.key === key)
          paramsOptionsObj.options = filterArr
        } else if (_.isNumber(filterVal) && obj) {
          const filterArr = _.cloneDeep(obj.options).filter(d => d.toLowerCase().includes(filterVal))
          const paramsOptionsObj = this.paramsOptions.find(d => d.key === key)
          paramsOptionsObj.options = filterArr
        }
      } else {
        this.paramsOptions = _.cloneDeep(this.newParamsOptions)
        this.rangeNumber = 10
      }
    },
    loadMore () {
      this.rangeNumber += 10
    },
    onVisibleChange (flag) {
      if (!flag) {
        this.rangeNumber = 0
      }
    }
  }
 }
--- a/src/components/rightBox/settings/RoleBox.vue
+++ b/src/components/rightBox/settings/RoleBox.vue
@@ -18,7 +18,7 @@
            <el-input maxlength="255" show-word-limit :rows="2" size='mini' type="textarea" v-model="editRole.remark" id="role-box-input-remark"/>
          </el-form-item>
-          <el-form-item :label="$t('config.roles.permission')" class="my-form-item">
+          <el-form-item :label="$t('config.roles.permission')">
            <!--<div class="tree-option">
              <button type="button" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new option-btn" style="margin-left: 0px;" @click="expandAllOrNone" :class="{'btn-active':expandAllFlag}">展开/收缩</button>
              <button type="button" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new option-btn" @click="selectAllOrNone" :class="{'btn-active':selectAllFlag}"><span ><i class="cn-icon cn-icon-delete"></i></span></button>
@@ -27,8 +27,8 @@
            <el-tree :data="menus" :default-expand-all="expandAllFlag" check-strictly="true" :props="{label:labelFormatter}"  @check-change="selectChange" class="tree-border" node-key="id" ref="menuTree" show-checkbox id="role-box-input-menus">
              <template #default="{ data }">
              <span>
-                <el-icon v-if="data.type === '1'"><Menu /></el-icon>
+                <i v-if="data.type === '1'" class="el-icon-menu"></i>
-                <el-icon v-if="data.type === '2'"><Edit /></el-icon>
+                <i v-if="data.type === '2'" class="el-icon-edit"></i>
              </span>
                {{$t(data.i18n)}}
              </template>
--- a/src/components/table/CnDataList.vue
+++ b/src/components/table/CnDataList.vue
@@ -12,8 +12,7 @@
                <el-input v-model="keyWord"  size="small" @keyup.enter="onSearch"></el-input>
                <!--                <el-button icon="el-icon-search" @click="onSearch" size="small"></el-button>-->
                <button class="top-tool-btn  top-tool-btn--search" style="border-radius: 0 2px 2px 0 !important;" @click="onSearch">
-                  <el-icon><Search /></el-icon>
+                  <i class="el-icon-search"></i>
                  <!--<i class="el-icon-search"></i>-->
                </button>
              </div>
            </div>
--- a/src/components/table/administration/GalaxyProxyTable.vue
+++ b/src/components/table/administration/GalaxyProxyTable.vue
@@ -48,7 +48,7 @@
                <span style="color: #41ABFD">{...}</span>
              </template>
              <div class="highlight-box">
-                <span class="highlight-box__copy-btn" @click="copyValue(scope.row[item.prop])"><el-icon><CopyDocument /></el-icon></span>
+                <span class="highlight-box__copy-btn" @click="copyValue(scope.row[item.prop])"><i class="el-icon-document-copy"></i></span>
                <highlightjs
                    language="json"
                    :code="scope.row[item.prop]"
@@ -70,7 +70,7 @@
                <span style="color: #41ABFD">{...}</span>
              </template>
              <div class="highlight-box">
-                <span class="highlight-box__copy-btn" @click="copyValue(scope.row[item.prop])"><el-icon><CopyDocument /></el-icon></span>
+                <span class="highlight-box__copy-btn" @click="copyValue(scope.row[item.prop])"><i class="el-icon-document-copy"></i></span>
                <highlightjs
                    language="js"
                    :code="scope.row[item.prop]"
--- a/src/components/table/administration/OperationLogTable.vue
+++ b/src/components/table/administration/OperationLogTable.vue
@@ -157,9 +157,3 @@ export default {
  }
 }
 </script>
 <style lang="scss">
 .list-page .cn-table .el-table:not(.chart-table) td {
  padding: 8px 0;
 }
 </style>
--- a/src/components/table/report/ReportTable.vue
+++ b/src/components/table/report/ReportTable.vue
@@ -3,9 +3,8 @@
    <el-table
        id="reportTable"
        ref="dataTable"
        :header-cell-class-name="headerCellClass"
        :data="tableData"
-        height="100%"
+        :height="height"
        :expand-row-keys="expandedIds"
        border
        empty-text=" "
@@ -214,7 +213,7 @@ import Loading from '@/components/common/Loading'
 import axios from 'axios'
 import { api } from '@/utils/api'
 import { storageKey, report } from '@/utils/constants'
-import { urlParamsHandler, overwriteUrl, headerCellClass } from '@/utils/tools'
+import { urlParamsHandler, overwriteUrl } from '@/utils/tools'
 import { ref } from 'vue'
 import { dateFormatToUTC, getNowTime } from '@/utils/date-util'
 import chartDetectionPagination from '@/views/charts/charts/chartDetectionPagination'
@@ -480,7 +479,6 @@ export default {
    })
  },
  methods: {
    headerCellClass,
    /**
     * 进入页面判断是否需要展开表格
     * 即展开表格后刷新界面，保持展开效果
@@ -785,9 +783,3 @@ export default {
  }
 }
 </script>
 <style lang="scss">
 .list-page .cn-table .el-table:not(.chart-table) td {
  padding: 7.5px 0;
 }
 </style>
--- a/src/components/table/setting/knowledgeBaseTableForCard.vue
+++ b/src/components/table/setting/knowledgeBaseTableForCard.vue
@@ -32,7 +32,7 @@
  <div class="center-dialog">
    <el-dialog v-model="showUpdateDialog"
               :destroy-on-close="true"
-               :class="showAddUpdateDialog ? 'update-knowledge update-knowledge--upload' : 'update-knowledge'"
+               :custom-class="showAddUpdateDialog ? 'update-knowledge update-knowledge--upload' : 'update-knowledge'"
               :before-close="beforeClose"
               :after-close="handleClose">
      <div class="knowledge-update__top" >
@@ -107,8 +107,9 @@
                    'update-dialog__table--psiphon3': updateKnowledge.source === 'cn_psiphon3_ip' && activeTab === 'intelligenceLearning',
                    'update-dialog__table--system-user': updateKnowledge.source === 'cn_psiphon3_ip' && activeTab !== 'intelligenceLearning'
                  }"
-                  :cell-style="myCellStyle"
+                  :header-cell-style="{background:'#f5f7fa',color:'#353636',fontWeight: '400',fontSize: '12px',borderRight: 'none',borderBottom: 'none'}"
-                  :header-cell-style="myHeaderCellStyle">
+                  cell-style="padding:6px 0px;font-size: 12px;color: #353636;font-weight: 400;line-height: 20px;border-right:none;"
                  header-cell-style="padding:8px 0px;font-size: 12px;color: #353636;font-weight: 500;border-right:none;">
          <el-table-column prop="opTime" :label="$t('entities.tab.informationAggregation.updateTime')" width="150" >
            <template #default="scope" :column="item">
              <span>{{scope.row.opTime ? dateFormatByAppearance(scope.row.opTime) : '-'}}</span>
@@ -201,7 +202,6 @@
                         :on-error="uploadError"
                         :class="uploadErrorTip ? 'el-upload--error' : ''"
                         :accept="fileTypeLimit"
                         style="margin-bottom: -10px"
                         :auto-upload="false"
                         ref="knowledgeUpload"
                         id="knowledgeUpload"
@@ -228,7 +228,7 @@
    </el-dialog>
    <el-dialog v-model="showConfirmDialog"
               :title="$t('overall.tips')"
-               class="update-knowledge-tip"
+               custom-class="update-knowledge-tip"
               :width="480"
               :before-close="handleConfirmClose">
      <div class="dialog-message">{{$t('knowledge.updateTips')}}</div>
@@ -326,27 +326,7 @@
          { value: 10080, name: this.$t('dateTime.last7Days') },
          { value: 21600, name: this.$t('dateTime.last15Days') },
          { value: 43200, name: this.$t('dateTime.last30Days') }
-        ],
+        ]
        myCellStyle: {
          padding: '6px 0px',
          'font-size': '12px',
          color: '#353636',
          'font-weight': 400,
          'line-height': '20px',
          'border-right': 'none'
        },
        myHeaderCellStyle: {
          padding: '8px 0px',
          'font-size': '12px',
          color: '#353636',
          'font-weight': 500,
          'border-right': 'none',
          background: '#f5f7fa',
          fontWeight: '400',
          fontSize: '12px',
          borderRight: 'none',
          borderBottom: 'none'
        }
      }
    },
    setup () {
--- a/src/components/table/system/PluginTable.vue
+++ b/src/components/table/system/PluginTable.vue
@@ -37,19 +37,19 @@
          </el-switch>
        </template>
        <template v-else-if="item.prop === 'type'">
-          <span class="type-tag">{{typeText(scope.row['id'])}}</span>
+          <span class="type-tag" v-for="type in scope.row.type">{{type}}</span>
        </template>
        <template v-else-if="item.prop === 'name'">
          <div class="plugin-name">
-            <div class="icon-background"><img class="plugin-name-icon" :src="getIconUrl(scope.row['id'])"/></div>
+            <div class="icon-background"><img class="plugin-name-icon" :src="scope.row['iconUrl']"/></div>
-            {{getName(scope.row['id'])}}
+            {{scope.row['name']}}
          </div>
        </template>
        <template v-else-if="item.prop === 'description'">
-          <div class="two-line" :title="getDescription(scope.row['id'])">{{getDescription(scope.row['id'])}}</div>
+          <div class="two-line" :title="$t(scope.row['desc'])">{{$t(scope.row['desc'])}}</div>
        </template>
        <template v-else-if="item.prop === 'schedule'">
-          <div class="two-line" >{{scheduleText(scope.row['id'])}}</div>
+          <div class="two-line" >{{$t(scope.row['schedule'])}}</div>
        </template>
        <span v-else>{{scope.row[item.prop] || '-'}}</span>
      </template>
@@ -110,36 +110,6 @@ export default {
    }
  },
  computed: {
    typeText () {
      return function (id) {
        const t = pluginBasicInfo.find(t => t.id === id)
        return t ? t.type : 'Unknown Tag'
      }
    },
    scheduleText () {
      return function (id) {
        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
        return basicInfo ? this.$t(basicInfo.schedule) : ''
      }
    },
    getIconUrl () {
      return function (id) {
        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
        return basicInfo ? basicInfo.iconUrl : ''
      }
    },
    getDescription () {
      return function (id) {
        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
        return basicInfo ? this.$t(basicInfo.desc) : '-'
      }
    },
    getName () {
      return function (id) {
        const basicInfo = pluginBasicInfo.find(bi => bi.id === id)
        return basicInfo ? this.$t(basicInfo.name) : '-'
      }
    }
  },
  methods: {
    statusChange (plugin) {
--- a/src/main.js
+++ b/src/main.js
@@ -15,7 +15,6 @@ import 'highlight.js/styles/color-brewer.css'
 import '@/assets/css/main.scss' // 样式入口
 import VueGridLayout from 'vue-grid-layout'
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 import bus from 'tiny-emitter'
 import DateTimeRange from '@/components/common/TimeRange/DateTimeRange'
@@ -24,8 +23,6 @@ import PanelChartList from '@/views/charts/PanelChartList'
 import Error from '@/components/common/Error'
 import Renderer from '@/components/advancedSearch/showhint/Hint/Renderer'
 import 'lib-flexible'
 import 'element-plus/theme-chalk/dark/css-vars.css'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 const emitter = new bus()
@@ -54,10 +51,6 @@ app.component('panel-chart-list', PanelChartList)
 app.component('chart-error', Error)
 app.component('Renderer', Renderer)
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
 }
 app.mount('#app')
 app.config.globalProperties.emitter = emitter
--- a/src/permission.js
+++ b/src/permission.js
@@ -179,6 +179,8 @@ export function handleComponent (code) {
      return () => import('@/views/administration/OperationLog')
    case 'appearance':
      return () => import('@/views/administration/Appearance')
    case 'license':
      return () => import('@/views/administration/License')
    case 'I18N':
      return () => import('@/views/administration/I18n')
    case 'system':
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -13,8 +13,7 @@ const store = createStore({
      showEntityTypeSelector: false, // 在entity explore页面时，控制header显示实体类型选择框
      from: '', // entity type
      test: 'jest', // 用于单测的demo
-      i18nObj: {}, // 存放i18n的值，用于搜索组件切换环境时参数包含其他语言时使用的
+      i18nObj: {} // 存放i18n的值，用于搜索组件切换环境时参数包含其他语言时使用的
      theme: 'light'
    }
  },
  getters: {
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -15,6 +15,9 @@ export const api = {
  logout: '/logout',
  pin: 'sys/user/pin',
  appearance: '/sys/appearance',
  license: '/sys/license/detail',
  licenseStatus: '/sys/license/status',
  downloadLicenseC2v: '/sys/license/download',
  permissions: '/sys/user/permissions',
  operationLog: '/sys/log',
  login: '/sys/login',
--- a/src/utils/constants.js
+++ b/src/utils/constants.js
@@ -1883,36 +1883,84 @@ export const performanceMetricMapping = {
 export const pluginBasicInfo = [
  {
-    id: 110,
+    id: 109,
    name: 'Psiphon3 VPN',
    type: ['IP'],
    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.psiphon3',
    iconUrl: 'images/knowledge-base-logo/psiphon3-vpn.png'
  },
  {
    id: 111,
    name: 'HotSpot VPN',
-    type: 'IP',
+    type: ['IP'],
-    schedule: 'plugin.daily',
+    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.hotSpot',
    iconUrl: 'images/knowledge-base-logo/hotspot-vpn.png'
  },
  {
-    id: 111,
+    id: 112,
    name: 'IpVanish VPN',
-    type: 'Domain',
+    type: ['IP', 'Domain'],
    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.ipVanishDomain',
    iconUrl: 'images/knowledge-base-logo/ip-vanish.png'
  },
  {
-    id: 112,
+    id: 113,
-    name: 'IpVanish VPN',
+    name: 'Ivacy VPN',
-    type: 'IP',
+    type: ['IP', 'Domain'],
-    schedule: 'plugin.hourly',
+    schedule: 'plugin.daily',
-    desc: 'knowledgeBase.desc.ipVanishIp',
+    desc: 'knowledgeBase.desc.ivacyDomain',
-    iconUrl: 'images/knowledge-base-logo/ip-vanish.png'
+    iconUrl: 'images/knowledge-base-logo/ivacy.png'
  },
  {
-    id: 109,
+    id: 114,
-    name: 'Psiphon3 VPN',
+    name: 'Proton VPN',
-    type: 'IP',
+    type: ['IP'],
-    schedule: 'plugin.always',
+    schedule: 'plugin.hourly',
-    desc: 'knowledgeBase.desc.psiphon3',
+    desc: 'knowledgeBase.desc.protonvpn',
-    iconUrl: 'images/knowledge-base-logo/psiphon3-vpn.png'
+    iconUrl: 'images/knowledge-base-logo/protonvpn.png'
  },
  {
    id: 115,
    name: 'CyberGhost VPN',
    type: ['IP', 'Domain'],
    schedule: 'plugin.daily',
    desc: 'knowledgeBase.desc.cyberGhostDomain',
    iconUrl: 'images/knowledge-base-logo/cyber-ghost.png'
  },
  {
    id: 116,
    name: 'Windscribe VPN',
    type: ['IP', 'Domain'],
    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.windscribeDomain',
    iconUrl: 'images/knowledge-base-logo/windscribe.png'
  },
  {
    id: 117,
    name: 'Turbo VPN',
    type: ['IP'],
    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.turboIp',
    iconUrl: 'images/knowledge-base-logo/turbo.png'
  },
  {
    id: 118,
    name: 'Gecko VPN',
    type: ['IP'],
    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.geckoIp',
    iconUrl: 'images/knowledge-base-logo/gecko.png'
  },
  {
    id: 119,
    name: 'Vpnunlimited',
    type: ['IP'],
    schedule: 'plugin.hourly',
    desc: 'knowledgeBase.desc.vpnunlimited',
    iconUrl: 'images/knowledge-base-logo/vpnunlimited.png'
  }
 ]
@@ -2553,7 +2601,7 @@ export const entityDetailTags = {
    },
    {
      name: 'vpnServiceName',
-      type: 'normal'
+      type: 'negative'
    }
  ],
  ip: [
@@ -2579,7 +2627,7 @@ export const entityDetailTags = {
    },
    {
      name: 'vpnServiceName',
-      type: 'normal'
+      type: 'negative'
    }
  ],
  app: [
--- a/src/utils/http.js
+++ b/src/utils/http.js
@@ -31,7 +31,7 @@ axios.interceptors.request.use(config => {
 err => Promise.reject(err)
 )
 const accountErrorCode = [518003, 518004, 518005, 518006, 518007, 518008] // 账号锁定等
-const licenceErrorCode = [711001]
+const licenceErrorCode = [715001]
 // 若get请求的url中带问号，则将url上的参数截取，改为对象形式传参
 axios.interceptors.request.use(
--- a/src/utils/tools.js
+++ b/src/utils/tools.js
@@ -1502,7 +1502,7 @@ export const formatTags = (data, type, list) => {
    if (k !== 'userDefinedTags' && data[k]) {
      if (_.isArray(data[k])) {
        data[k].forEach(k3 => {
-          const find = entityDetailTags[type].find(t => t.name === k3.vpnServiceName)
+          const find = entityDetailTags[type].find(t => t.name === 'vpnServiceName')
          if (find) {
            list.push({ key: 'vpnServiceName', value: tagValueHandler(k3.vpnServiceName), type: find.type })
          } else {
@@ -1565,7 +1565,3 @@ const tagValueHandler = (value) => {
  const find = tagValueLabelMapping.find(t => t.value === value)
  return find ? find.name : value
 }
 export const headerCellClass = (row) => {
  return 'my-header-cell-class'
 }
--- a/src/views/administration/Appearance.vue
+++ b/src/views/administration/Appearance.vue
@@ -51,7 +51,7 @@
        <button style="position: relative;" :class="{'footer__btn--disabled': blockOperation.save}" :disabled="blockOperation.save" class="footer__btn" @click="save"
                v-if="hasPermission('editAppearence')"
        >
-          <el-loading size="small" :loading="blockOperation.save"></el-loading>
+          <loading size="small" :loading="blockOperation.save"></loading>
          <span>{{$t('overall.save')}}</span>
        </button>
      </div>
--- a/src/views/administration/I18n.vue
+++ b/src/views/administration/I18n.vue
@@ -51,7 +51,7 @@
    <el-drawer
        v-model="rightBox.show"
        direction="rtl"
-        class="common-right-box"
+        custom-class="common-right-box"
        :size="700"
        :with-header="false"
        destroy-on-close>
--- a/src/views/administration/License.vue
+++ b/src/views/administration/License.vue
@@ -0,0 +1,159 @@
 <template>
  <div class="license" :class="from">
    <div class="license-form">
      <el-form ref="licenseForm" :model="licenseObject"  label-position="left" label-width="134px" size="small">
        <el-form-item  :label="`${$t('license.type')}：`" prop="type">
          {{licenseObject.type}}
        </el-form-item>
        <el-form-item :label="`${$t('license.organization')}：`" prop="organization">
          <div class="">{{licenseObject.organization}}</div>
        </el-form-item>
        <el-form-item :label="`${$t('license.supportId')}：`" prop="supportID">
          <div class="">{{licenseObject.supportID}}</div>
        </el-form-item>
        <el-form-item :label="`${$t('license.dateIssued')}：`" prop="dateIssued">
          <div class="">{{licenseObject.dateIssued}}</div>
        </el-form-item>
        <el-form-item :label="`${$t('license.dateExpires')}：`" prop="dateExpires">
          <div class="">{{licenseObject.dateExpires}}</div>
        </el-form-item>
        <el-form-item :label="`${$t('license.licenseFile')}：`" >
          <div class="license-file">
            <button style="position: relative;" class="license__btn margin-r-20" @click.prevent="downloadFile">
              <i class="cn-icon-download1 cn-icon margin-r-6"></i><span>{{$t('license.download')}}</span>
            </button>
            <el-upload :action="`${baseUrl}sys/license/upload`"
                       ref="licenseUpload"
                       id="licenseUpload"
                       :headers="uploadHeaders"
                       :multiple="false"
                       :show-file-list="false"
                       :accept="fileTypeLimit"
                       :file-list="fileList"
                       :auto-upload="false"
                       :on-change="fileChange"
                       :on-success="uploadSuccess"
                       :on-error="uploadError">
              <button style="position: relative;" class="license__btn" @click.prevent="">
                <i class="cn-icon-upload1 cn-icon margin-r-6"></i><span>{{$t('license.upload')}}</span>
              </button>
            </el-upload>
          </div>
        </el-form-item>
      </el-form>
    </div>
  </div>
 </template>
 <script>
 import { api } from '@/utils/api'
 import { storageKey } from '@/utils/constants'
 import axios from 'axios'
 import { ref } from 'vue'
 import { dateFormat } from '@/utils/date-util'
 export default {
  name: 'License',
  data () {
    return {
      url: api.license,
      downloadC2vUrl: api.downloadLicenseC2v,
      licenseObject: { // 对象
        type: '',
        organization: '',
        supportID: '',
        dateIssued: '',
        dateExpires: ''
      }
    }
  },
  mounted () {
    this.initData()
  },
  methods: {
    initData () {
      axios.get(this.url, { pageSize: -1 }).then(response => {
        if (response.status === 200) {
          this.licenseObject = response.data.data.license
          this.licenseObject.dateExpires = dateFormat(new Date(this.licenseObject.hasp.feature.license.exp_date * 1000))
          this.licenseObject.dateIssued = dateFormat(new Date(this.licenseObject.hasp.production_date * 1000))
        }
      }).catch(e => {
        console.error(e)
        this.$message.error(this.errorMsgHandler(e))
      })
    },
    fileChange (file, fileList) {
      if (file.status !== 'ready') return
      if (!_.endsWith(file.name, '.xml')) {
        this.fileList = []
        this.$message.error(this.$t('validate.fileTypeLimit', { types: this.fileTypeLimit }))
      } else {
        this.fileList = fileList.slice(-1)
        this.$refs.licenseUpload.submit()
      }
    },
    uploadSuccess (response) {
      this.initData()
      this.$message.success(this.$t('tip.success'))
    },
    uploadError (error) {
      let errorMsg
      if (error.message) {
        errorMsg = JSON.parse(error.message).message
      } else {
        errorMsg = 'error'
      }
      this.$message.error(this.$t('tip.uploadFailed', { msg: errorMsg }))
    },
    downloadFile () {
      axios.get(this.downloadC2vUrl, { responseType: 'blob' }).then(res => {
        let fileName = ''
        if(res.headers['content-disposition']) {
          fileName = res.headers['content-disposition'].split(';')[1].split('filename=')[1]
        }
        if (window.navigator.msSaveOrOpenBlob) {
          // 兼容ie11
          const blobObject = new Blob([res.data])
          window.navigator.msSaveOrOpenBlob(blobObject, fileName)
        } else {
          const url = URL.createObjectURL(new Blob([res.data]))
          const a = document.createElement('a')
          document.body.appendChild(a) // 此处增加了将创建的添加到body当中
          a.href = url
          a.download = fileName
          a.target = '_blank'
          a.click()
          a.remove() // 将a标签移除
        }
      }, error => {
        const $self = this
        const reader = new FileReader()
        reader.onload = function (event) {
          const responseText = reader.result
          const exception = JSON.parse(responseText)
          if (exception.message) {
            $self.$message.error(exception.message)
          } else {
            console.error(error)
          }
        }
        reader.readAsText(error.response.data)
      })
    }
  },
  setup () {
    return {
      baseUrl: BASE_CONFIG.baseUrl,
      apiVersion: BASE_CONFIG.apiVersion,
      uploadHeaders: {
        'Cn-Authorization': localStorage.getItem(storageKey.token)
      },
      fileTypeLimit: '.xml',
      fileList: ref([])
    }
  }
 }
 </script>
--- a/src/views/administration/Roles.vue
+++ b/src/views/administration/Roles.vue
@@ -55,7 +55,7 @@
    <el-drawer
            v-model="rightBox.show"
            direction="rtl"
-            class="common-right-box"
+            custom-class="common-right-box"
            :with-header="false"
            :size="700"
            destroy-on-close>
--- a/src/views/administration/User.vue
+++ b/src/views/administration/User.vue
@@ -52,7 +52,7 @@
    <el-drawer
            v-model="rightBox.show"
            direction="rtl"
-            class="common-right-box"
+            custom-class="common-right-box"
            :size="700"
            :with-header="false"
            destroy-on-close>
--- a/src/views/charts/charts/ChartNoData.vue
+++ b/src/views/charts/charts/ChartNoData.vue
@@ -1,8 +1,8 @@
 <template>
  <div v-if="activeTab !== 709 && activeTab !== 710" class="panel-chart__no-data">{{ $t('npm.noData') }}</div>
  <div v-else class="panel-chart__no-data all-clear">
-    <div class="no-recent-alerts" style="align-items: center">
+    <div class="no-recent-alerts">
-      <el-icon><CircleCheck /></el-icon>
+      <i class="el-icon-circle-check"></i>
      <span>{{$t('detection.allClear')}}</span>
    </div>
    <div class="no-detection">{{$t('detection.noDetection')}}</div>
--- a/src/views/charts2/charts/linkMonitor/LinkBlock.vue
+++ b/src/views/charts2/charts/linkMonitor/LinkBlock.vue
@@ -239,13 +239,7 @@ export default {
              data.forEach(item => {
                item.totalBitsRate = item.outBitsRate + item.inBitsRate
                linkConfig.filter(info => info.interfaceName === item.interfaceName).forEach(info => {
                  if (info.direction === 0) {
                    item.outLinkId = info.linkId
                  } else if (info.direction === 1) {
                    item.inLinkId = info.linkId
                  } else if (info.direction === 2) {
                  item.linkId = info.linkId
                  }
                })
              })
@@ -389,7 +383,7 @@ export default {
      return width
    },
    drillLinkId (item) {
-      const queryCondition = `out_link_id = ${item.outLinkId} or in_link_id = ${item.inLinkId}`
+      const queryCondition = `out_link_id = ${item.linkId} or in_link_id = ${item.linkId}`
      beforeRouterPush()
      this.$router.push({
        query: {
--- a/src/views/charts2/charts/linkMonitor/LinkTrafficSankey.vue
+++ b/src/views/charts2/charts/linkMonitor/LinkTrafficSankey.vue
@@ -168,7 +168,7 @@ export default {
      if (tab === 0) {
        result.forEach(t => {
          this.cnLinkInfo.forEach(e => {
-            if (parseInt(t.commonInLinkId) === e.linkId) {
+            if (parseInt(t.inLinkId) === e.linkId) {
              t.linkId = e.interfaceName
              t.linkDirection = e.peerCity
              t.bandwidth = e.bandwidth
@@ -182,7 +182,7 @@ export default {
      } else {
        result.forEach(t => {
          this.cnLinkInfo.forEach(e => {
-            if (parseInt(t.commonOutLinkId) === e.linkId) {
+            if (parseInt(t.outLinkId) === e.linkId) {
              t.linkId = e.interfaceName
              t.bandwidth = e.bandwidth
              t.linkDirection = e.peerCity
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue
@@ -111,7 +111,7 @@
            </el-tab-pane>
          </el-tabs>
          <div class="body__searcher">
-            <el-input v-model="searcherApp" @input="searcherAppChange" size="mini" :placeholder="$t('networkOverview.search')" prefix-icon="Search" test-id="search-input"></el-input>
+            <el-input v-model="searcherApp" @input="searcherAppChange" size="mini" :placeholder="$t('networkOverview.search')" prefix-icon="el-icon-search" test-id="search-input"></el-input>
          </div>
          <div class="body__loading"><loading :loading="loading"></loading></div>
        </div>
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewLine.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewLine.vue
@@ -53,7 +53,7 @@
    </div>
    <div style="height: calc(100% - 74px); position: relative">
      <chart-no-data v-if="isNoData && !showError"></chart-no-data>
-      <div class="chart-drawing" v-show="showMarkLine && !isNoData && !showError" ref="overviewLineChart" id="overviewLineChart"></div>
+      <div class="chart-drawing" v-show="showMarkLine && !isNoData && !showError" ref="overviewLineChart"></div>
    </div>
  </div>
 </template>
@@ -353,8 +353,7 @@ export default {
          if (this.myChart) {
            this.myChart.dispose()
          }
-          // this.myChart = echarts.init(this.$refs.overviewLineChart)
+          this.myChart = echarts.init(this.$refs.overviewLineChart)
          this.myChart = echarts.init(document.getElementById('overviewLineChart'))
          this.myChart.setOption(this.chartOption)
          this.myChart.dispatchAction({
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
@@ -61,14 +61,14 @@
                        <div :ref="`tabSearchRef${tab.prop}`">
                          <div class="tab-search-button" :id="`tabSearchButton${tab.prop}`" v-show="showSearchButton"
                               @click="handlePopoverShow(item.prop,tab.prop)">
-                            <el-icon style="color:#575757;"><Search /></el-icon>
+                            <i class="el-icon-search" style="color:#575757;" ></i>
                            <!--<i class="el-icon-search" style="color:#575757;" ></i>-->
                          </div>
                          <div class="tab-search-input"  v-show="showSearchInput">
                            <el-input :id="`tabSearchValue${tab.prop}`"
                                      name="tabSearchValue"
                                      size="mini"
                                      readonly
                                      prefix-icon="cn-icon cn-icon-search"
                                      @click="showListPopover(item.prop)"
                            >
                              <template v-if="curTabProp === 'qtype'">
@@ -1854,18 +1854,20 @@ export default {
      this.activeCustomize = tab.paneName
    },
    tableCellStyle ({ row, column, rowIndex, columnIndex }) {
-      // element-plus 2.5以上版本表头样式支持对象而不是字符串
+      let style = 'border-right:0px;font-size:12px;padding:7px 0 !important;border-bottom: 1px solid #ECECEC;height:39px !important;'
-      let style = { 'border-right': '0px', 'font-size': '12px', padding: '7px 0 7px 1px !important', 'border-bottom': '1px solid var(--el-table-border-color)', height: '39.54px !important' }
+      if (rowIndex === this.tableData.length - 1) {
        // style = style + 'border-bottom:0px !important;'
      }
      if (columnIndex === 0) {
-        style = { ...style, color: '#046ECA', 'text-align': 'left' }
+        style = style + 'color:#046ECA;text-align:left;'
      }
      return style
    },
    tableHeaderCellStyle ({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
-        return { 'text-align': 'left', 'border-right': '0px', 'font-size': '12px', 'font-weight': 500, padding: '5px 0 !important', 'border-bottom': '1px solid var(--el-table-border-color)' }
+        return 'text-align:left;border-right:0px;font-size:12px;font-weight:500;padding:5px 0 !important;border-bottom: 1px solid #E2E5EC;'
      } else {
-        return { 'border-right': 0, 'font-size': '12px', 'font-weight': 500, padding: '4px 0 !important', 'border-bottom': '1px solid var(--el-table-border-color)' }
+        return 'border-right:0px;font-size:12px;font-weight:500;padding:4px 0 !important;border-bottom: 1px solid #E2E5EC;'
      }
    },
    getQueryCondition () {
--- a/src/views/charts2/charts/npm/NpmAppCategoryScore.vue
+++ b/src/views/charts2/charts/npm/NpmAppCategoryScore.vue
@@ -27,7 +27,7 @@
      <template v-for="(item, index) in customTableTitles" :key="index">
        <el-table-column class="data-column">
          <template #header>
-            <span class="data-column__span" style="margin-left: -2px;">{{$t(item.label)}}</span>
+            <span class="data-column__span">{{$t(item.label)}}</span>
          </template>
          <template  #default="scope" :column="item">
            <div class="data-total">
--- a/src/views/charts2/charts/npm/NpmTrafficLine.vue
+++ b/src/views/charts2/charts/npm/NpmTrafficLine.vue
@@ -13,7 +13,7 @@
              :popper-append-to-body="false"
              @change="metricChange"
          >
-            <el-option v-for="item in metricOptions" :key="item.value" :label="$t(item.label)" :value="item.value"></el-option>
+            <el-option v-for="item in metricOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </div>
      </div>
--- a/src/views/detections/DetectionFilter.vue
+++ b/src/views/detections/DetectionFilter.vue
@@ -7,7 +7,7 @@
        <div class="filter__header">{{filter.title}}</div>
        <div class="filter__body" style="position: relative">
-<!--          <loading :loading="false" style="top: -5px;"></loading>-->
+          <loading :loading="loadingLeft" style="top: -5px;"></loading>
          <div class="filter__body-item"
               v-for="(data, i) in filter.data.slice(0, filter.showIndex)"
--- a/src/views/detections/Index.vue
+++ b/src/views/detections/Index.vue
@@ -4,7 +4,7 @@
    <div class="explorer-top-tools explorer-detection-top-tools">
      <div class="explorer-top-tools-title">{{$t('overall.detections')}}</div>
      <div style="display: flex">
-        <div class="explorer-top-tools-block" @click="jumpNewDetetion" v-if="hasPermission('detectionPolicy')">
+        <div class="explorer-top-tools-block" @click="jumpNewDetetion">
          <i class="cn-icon cn-icon-configure-policies detection-icon-setting"></i>
          <span>{{$t('config.detections.configurePolicies')}}</span>
        </div>
@@ -38,7 +38,7 @@
         <div class="no-data detection__event-severity-bar" >{{ $t('npm.noData') }}</div>
      </template>
      <template v-if="!isEventSeverityNoData">
-        <div class="detection__event-severity-bar detection-border"  :id="`eventSeverityTrendBar${pageType}`"  :ref="`eventSeverityTrendBar${pageType}`">
+        <div class="detection__event-severity-bar detection-border"  :id="`eventSeverityTrendBar${pageType}`">
        </div>
      </template>
      <div style="display: flex; flex-grow: 1; height: 100%;">
@@ -322,8 +322,7 @@ export default {
            }
          })
-          // const chartDom = document.getElementById(`eventSeverityTrendBar${this.pageType}`)
+          const chartDom = document.getElementById(`eventSeverityTrendBar${this.pageType}`)
          const chartDom = this.$refs.eventSeverityTrendBarsecurityEvent
          const eventSeverityTrendOption = this.$_.cloneDeep(multipleBarOption)
          const key = changeI18nOfSeverity(data[0].severity)
--- a/src/views/detections/detectionPolicies/PolicyForm.vue
+++ b/src/views/detections/detectionPolicies/PolicyForm.vue
@@ -163,14 +163,13 @@ import { ref } from 'vue'
 import { getDurationsTimeByType, getTimeByDurations } from '@/utils/date-util'
 import Loading from '@/components/common/Loading'
 import { storageKey, detectionUnitList, ZH, EN } from '@/utils/constants'
 import { ElMessageBox } from 'element-plus'
 export default {
  name: 'DetectionForm',
  data () {
    const intervalValidator = (rule, value, callback) => {
      const obj = this.handleIntervalByDateType(rule, value, this.triggerObj.intervalVal)
-      if (obj && !obj.flag && obj.msg) {
+      if (!obj.flag && obj.msg) {
        callback(new Error(obj.msg))
      } else {
        callback()
@@ -178,7 +177,7 @@ export default {
    }
    const intervalValValidator = (rule, value, callback) => {
      const obj = this.handleIntervalByDateType(rule, this.triggerObj.intervalVal, value)
-      if (obj && !obj.flag && obj.msg) {
+      if (!obj.flag && obj.msg) {
        this.$refs.form3.validateField('interval')
        callback()
      } else {
@@ -187,7 +186,7 @@ export default {
    }
    const resetIntervalValidator = (rule, value, callback) => {
      const obj = this.handleIntervalByDateType(rule, value, this.triggerObj.resetIntervalVal)
-      if (obj && !obj.flag && obj.msg) {
+      if (!obj.flag && obj.msg) {
        callback(new Error(obj.msg))
      } else {
        callback()
@@ -195,7 +194,7 @@ export default {
    }
    const resetIntervalValValidator = (rule, value, callback) => {
      const obj = this.handleIntervalByDateType(rule, this.triggerObj.resetIntervalVal, value)
-      if (obj && !obj.flag && obj.msg) {
+      if (!obj.flag && obj.msg) {
        this.$refs.form3.validateField('resetInterval')
        callback()
      } else {
@@ -549,12 +548,12 @@ export default {
      }
    },
    confirmMessage (queryInfo) {
-      ElMessageBox.confirm(this.$t('tip.leavePage'), {
+      this.$confirm(this.$t('tip.leavePage'), {
        confirmButtonText: this.$t('tip.confirm'),
        cancelButtonText: this.$t('overall.cancel'),
        message: this.$t('tip.leavePageTips'),
        title: this.$t('tip.leavePage'),
-        // type: 'warning',
+        type: 'warning',
        iconClass: 'width:0px;height:0px;',
        customClass: 'del-model'
      }).then(() => {
@@ -572,22 +571,7 @@ export default {
 </script>
 <style lang="scss">
 .el-overlay-message-box, .el-message-box {
  padding: 0 !important;
 }
 .el-overlay-message-box {
  text-align: center !important;
 }
 .is-message-box .el-overlay-message-box {
  display: flex;
  justify-content: center;
  align-items: center;
 }
 .del-model {
  &.el-message-box {
    max-width: 480px !important;
  }
  display: flex;
  flex-direction: column;
  padding-bottom: 0 !important;
@@ -601,8 +585,8 @@ export default {
    height: 42px;
    background: #F7F7F7;
    box-shadow: 0 1px 0 0 rgba(53, 54, 54, 0.08);
-    padding-left: 21px;
+    padding-left: 20px;
-    padding-top: 10px;
+    padding-top: 14px;
    padding-bottom: 14px;
    .el-message-box__headerbtn {
@@ -612,7 +596,7 @@ export default {
      align-items: center;
      font-size: 10px;
      line-height: 10px;
-      padding-right: 10px !important;
+      padding-right: 5px !important;
      i {
        width: 10px;
@@ -635,9 +619,9 @@ export default {
    letter-spacing: 0;
    line-height: 22px;
    font-weight: 400;
-    padding-top: 9px;
+    padding-top: 8px;
    padding-right: 20px;
-    padding-left: 21px;
+    padding-left: 20px;
    .el-message-box__message {
      padding-left: 0 !important;
@@ -649,11 +633,8 @@ export default {
    height: 52px;
    border-top: 1px solid #eee;
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.07);
-    padding: 13px 1px 12px 0 !important;
+    padding: 11px 0 12px !important;
    .el-button {
      font-size: 12px;
    }
    .el-button--small {
      padding: 8px 21px !important;
      line-height: 12px;
--- a/src/views/detections/detectionPolicies/PolicyTools.vue
+++ b/src/views/detections/detectionPolicies/PolicyTools.vue
@@ -42,8 +42,7 @@
            class="top-tool-btn top-tool-btn--search"
            style="border-radius: 0 2px 2px 0 !important;"
            @click="onSearch">
-          <el-icon><Search /></el-icon>
+          <i class="el-icon-search"></i>
 <!--          <i class="el-icon-search"></i>-->
        </button>
      </div>
    </div>
--- a/src/views/entityExplorer/EntityExplorer.vue
+++ b/src/views/entityExplorer/EntityExplorer.vue
@@ -41,15 +41,15 @@
        ></explorer-search>
        <div style="display: flex;flex-direction: column;height: calc(100% - 42px);">
-          <div class="explorer-result" v-if="showList" style="position: relative;display: flex">
+          <div class="explorer-result" v-if="showList" style="position: relative;">
            <loading :loading="loadingCount" style="width: 240px"></loading>
-            <span>{{ summaryCount.totalCount }}&nbsp;</span>{{$t('overall.results')}}，IP<span class="margin-r-3"></span>
+            <span>{{ summaryCount.totalCount }}&nbsp;</span>{{$t('overall.results')}}，IP
-            <span>{{ summaryCount.ipCount }}</span>，{{$t('overall.domain')}}<span class="margin-r-3"></span>
+            <span>{{ summaryCount.ipCount }}</span>，{{$t('overall.domain')}}
-            <span>{{ summaryCount.domainCount }}</span>，APP<span class="margin-r-3"></span>
+            <span>{{ summaryCount.domainCount }}</span>，APP
            <span>{{ summaryCount.appCount }}</span>
            <span class="entity-hide-entity" v-if="q">
-              <span v-if="listData.length !== 0">
+<!--              <span v-if="listData.length !== 0">-->
 <!--                <el-checkbox-->
 <!--                    v-model="isHideRelatedEntities"-->
 <!--                    :label="$t('entity.hideRelatedEntities')"-->
@@ -60,7 +60,7 @@
                  <el-radio :label="true" size="large">{{ $t('entity.entityMode') }}</el-radio>
                  <el-radio :label="false" style="margin-left: -10px;" size="large">{{ $t('entity.relatedMode') }}</el-radio>
                </el-radio-group>
-              </span>
+<!--              </span>-->
            </span>
          </div>
@@ -614,9 +614,9 @@ export default {
          this.listData = []
          this.$nextTick(() => {
            this.listData = response.data.data.list
-            if (this.listData.length === 0) {
+            /*if (this.listData.length === 0) {
              this.isHideRelatedEntities = false
-            }
+            }*/
          })
        } else {
          this.$message.error(response.data.message)
--- a/src/views/entityExplorer/EntityGraph.vue
+++ b/src/views/entityExplorer/EntityGraph.vue
@@ -7,7 +7,6 @@
          v-model="rightBox.show"
          direction="rtl"
          custom-class="entity-graph__detail"
          class="entity-graph__detail"
          :close-on-click-modal="true"
          :modal="false"
          :size="400"
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
chenjinsong	284888863e	fix: 恢复detection的policy显示	2024-05-20 11:26:59 +08:00
刘洪洪	5c4993cf12	fix: 修复report编辑按钮不会disabled的问题	2024-05-11 18:17:55 +08:00
刘洪洪	b8ee685230	fix: report一系列问题修改	2024-05-11 16:28:27 +08:00
陈劲松	30b1328576	Merge branch 'cherry-pick-3513a9c1' into 'dev-24.01-m22' fix: 修复entity的搜索测试用例报错的问题 See merge request cyber-narrator/cn-ui!72	2024-05-11 06:49:45 +00:00
刘洪洪	740e7bbae6	fix: 修复entity的搜索测试用例报错的问题 (cherry picked from commit `3513a9c145`)	2024-05-11 06:49:38 +00:00
陈劲松	f020fe33b5	Merge branch 'cherry-pick-df183c18' into 'dev-24.01-m22' fix: 修复entity和detection搜索时随意输入字段，没有错误提示且resource为空的问题 See merge request cyber-narrator/cn-ui!71	2024-05-09 09:08:56 +00:00
刘洪洪	75b47d7ba7	fix: 修复entity和detection搜索时随意输入字段，没有错误提示且resource为空的问题 (cherry picked from commit `df183c1836`)	2024-05-09 09:08:48 +00:00
chenjinsong	a26b0c848d	fix: 修复链路四元组图字段名未升级的问题	2024-04-30 17:06:46 +08:00
陈劲松	d2ad042cf9	Merge branch 'cherry-pick-ca6f6a02' into 'dev-24.01-m22' CN-1651 fix: 修复链路links下钻报错问题 See merge request cyber-narrator/cn-ui!69	2024-04-28 10:31:54 +00:00
chenjinsong	a844d44d1d	CN-1651 fix: 修复链路links下钻报错问题 (cherry picked from commit `ca6f6a02e9`)	2024-04-28 10:31:45 +00:00
chenj	ad603339de	fix: 隐藏detection页的policy入口	2024-04-01 21:06:04 +08:00
陈劲松	08f0cd4522	Merge branch 'cherry-pick-e645eeb1' into 'dev-24.01' fix: 更改license失效码 See merge request cyber-narrator/cn-ui!68	2024-03-25 07:51:28 +00:00
chenjinsong	0c20757d07	fix: 更改license失效码 (cherry picked from commit `e645eeb1a5`)	2024-03-25 07:51:22 +00:00
陈劲松	2c7c7293b4	Merge branch 'cherry-pick-5511191c' into 'dev-24.01' fix: license上传文件后进行页面刷新 See merge request cyber-narrator/cn-ui!67	2024-03-25 07:51:06 +00:00
hanyuxia	d035677c2f	fix: license上传文件后进行页面刷新 (cherry picked from commit `5511191c90`)	2024-03-25 07:50:57 +00:00
陈劲松	50cdbde8bf	Merge branch 'cherry-pick-8a18fb09' into 'dev-24.01' fix: 许可证下载文件名称从响应头中的Content-Disposition获取 See merge request cyber-narrator/cn-ui!66	2024-03-25 07:49:56 +00:00
hanyuxia	d27738b9ec	fix: 许可证下载文件名称从响应头中的Content-Disposition获取 (cherry picked from commit `8a18fb09f4`)	2024-03-25 07:49:49 +00:00
chenjinsong	85456c1e47	fix: 更改插件的周期信息	2024-03-20 20:08:33 +08:00
陈劲松	327cbde233	Merge branch 'cherry-pick-bcf57611' into 'dev-24.01' feat:插件id及逻辑变动(有一些同名，但type(ip、domain)不同的，合并成一条；合并后的记录，type列既有ip标签又有domain标签) See merge request cyber-narrator/cn-ui!65	2024-03-20 09:56:48 +00:00
hyx	cbf71eb1b9	feat:插件id及逻辑变动(有一些同名，但type(ip、domain)不同的，合并成一条；合并后的记录，type列既有ip标签又有domain标签) (cherry picked from commit `bcf57611ef`)	2024-03-20 09:56:40 +00:00
chenjinsong	4e0eb3f143	fix: 修复license未认证的情况下，按回车键可以登录的问题	2024-03-19 16:03:21 +08:00
陈劲松	a17c68bb26	Merge branch 'cherry-pick-da015603' into 'dev-24.01' fix: 修复下载license时文件名不对的问题 See merge request cyber-narrator/cn-ui!63	2024-03-19 07:46:16 +00:00
chenjinsong	d1ae513124	fix: 修复下载license时文件名不对的问题 (cherry picked from commit `da0156031c`)	2024-03-19 07:46:09 +00:00
陈劲松	91915996c0	Merge branch 'cherry-pick-d0b29c24' into 'dev-24.01' feat: CN-1558 开发license页面，支持license拦截 See merge request cyber-narrator/cn-ui!62	2024-03-19 03:04:37 +00:00
hanyuxia	8f17647752	feat: CN-1558 开发license页面，支持license拦截 (cherry picked from commit `d0b29c24ba`)	2024-03-19 03:04:31 +00:00
陈劲松	29a319609e	Merge branch 'cherry-pick-21da4f0d' into 'dev-24.01' feat: CN-1558 开发license页面，支持license拦截 See merge request cyber-narrator/cn-ui!61	2024-03-19 03:04:10 +00:00
hanyuxia	08ae827e31	feat: CN-1558 开发license页面，支持license拦截 (cherry picked from commit `21da4f0d49`)	2024-03-19 03:04:04 +00:00
陈劲松	854a846296	Merge branch 'cherry-pick-06a8bd96' into 'dev-24.01' feat: CN-1558 开发license页面，支持license拦截 See merge request cyber-narrator/cn-ui!60	2024-03-19 03:02:37 +00:00
hanyuxia	42aa7671a3	feat: CN-1558 开发license页面，支持license拦截 (cherry picked from commit `06a8bd9626`)	2024-03-19 03:02:30 +00:00
陈劲松	fb89134f95	Merge branch 'cherry-pick-4429d225' into 'dev-24.01' feat: CN-1558 开发license页面(未完成：登陆页支持license拦截） See merge request cyber-narrator/cn-ui!59	2024-03-19 03:01:31 +00:00
hyx	584ad8d538	feat: CN-1558 开发license页面(未完成：登陆页支持license拦截） (cherry picked from commit `4429d225f1`)	2024-03-19 03:01:23 +00:00
chenjinsong	c43a17c984	feat: 新增一个vpn	2024-01-30 10:31:37 +08:00
chenjinsong	df5decc3b4	feat: 新增一个vpn	2024-01-30 10:31:36 +08:00
刘洪洪	cca54359a8	fix: 修复schema字段变动导致模糊搜索不能识别的问题	2024-01-30 10:30:03 +08:00
chenjinsong	9e8b3e9d64	fix: vpn类的tag都标位红色	2024-01-29 14:17:36 +08:00
chenjinsong	8e5f5b49cb	fix: plugin增加请求参数pageSize=-1	2024-01-29 11:05:59 +08:00
chenjinsong	4441bdef10	fix: 调整plugin页面样式	2024-01-26 17:35:01 +08:00
hyx	849df8c8d8	feat:增加9个系统插件	2024-01-25 12:29:58 +08:00
hyx	475b112835	fix: 调整npm下钻表格列 loading样式	2024-01-18 19:05:17 +08:00