CN-1416 fix: 增加一些字符的国际化映射

2023-10-30 11:14:58 +08:00
parent 186e115adf
commit dbc68077ca
10 changed files with 261 additions and 99 deletions
--- a/src/components/table/detection/GeneralSettings.vue
+++ b/src/components/table/detection/GeneralSettings.vue
@@ -47,7 +47,7 @@
          <el-option
              v-for="item in categoryList"
              :key="item.value"
-              :label="item.label"
+              :label="$t(item.label)"
              :value="item.value"
          />
        </el-select>
@@ -59,7 +59,7 @@
          <el-option
              v-for="item in eventTypeList"
              :key="item.value"
-              :label="item.label"
+              :label="$t(item.label)"
              :value="item.value"
          />
        </el-select>
@@ -109,9 +109,8 @@
 </template>

 <script>
-import { detectionRuleType, storageKey } from '@/utils/constants'
+import { detectionRuleType, storageKey, detectionUnitList } from '@/utils/constants'
 import { switchStatus } from '@/utils/tools'
-import { detectionUnitList } from '@/utils/static-data'

 export default {
  name: 'GeneralSettings',
--- a/src/components/table/detection/RuleDefinition.vue
+++ b/src/components/table/detection/RuleDefinition.vue
@@ -169,7 +169,7 @@
            <el-option
                v-for="item in sourceList"
                :key="item.value"
-                :label="item.label"
+                :label="$t(item.label)"
                :value="item.value"
            />
          </el-select>
@@ -199,7 +199,7 @@
            <el-option
                v-for="item in levelList"
                :key="item.label"
-                :label="item.label"
+                :label="$t(item.label)"
                :value="item.value"
            />
          </el-select>
@@ -215,8 +215,7 @@

 <script>
 import HistoryTopKeys from '@/components/table/detection/HistoryTopKeys'
-import { eventSeverityColor, detectionRuleType } from '@/utils/constants'
-import { detectionUnitList } from '@/utils/static-data'
+import { eventSeverityColor, detectionRuleType, detectionUnitList, securityLevel } from '@/utils/constants'
 import axios from 'axios'
 import _ from 'lodash'
 import { api } from '@/utils/api'
@@ -372,7 +371,7 @@ export default {
  methods: {
    initData () {
      this.sourceList = detectionUnitList.sourceList || []
-      this.levelList = detectionUnitList.levelList || []
+      this.levelList = securityLevel || []
      // threshold模式还没确定，所以数据暂时静态数据，后续根据需要修改
      this.conditionList = detectionUnitList.conditionList || []
      this.metricList = detectionUnitList.metricList || []
--- a/src/utils/constants.js
+++ b/src/utils/constants.js
--- a/src/utils/static-data.js
+++ b/src/utils/static-data.js
@@ -221,27 +221,27 @@ export const dataForDnsTrafficLine = {
 export const dataForNpmEventsHeader = {
  chartData: [
    {
-      eventSeverity: 'critical',
+      eventSeverity: 'overall.critical',
      count: '-',
      index: 0
    },
    {
-      eventSeverity: 'high',
+      eventSeverity: 'overall.high',
      count: '-',
      index: 1
    },
    {
-      eventSeverity: 'medium',
+      eventSeverity: 'overall.medium',
      count: '-',
      index: 2
    },
    {
-      eventSeverity: 'low',
+      eventSeverity: 'overall.low',
      count: '-',
      index: 3
    },
    {
-      eventSeverity: 'info',
+      eventSeverity: 'overall.info',
      count: '-',
      index: 4
    }
@@ -430,59 +430,3 @@ export const connectionList = [
  //   label: 'OR'
  // }
 ]
-
-export const detectionUnitList = {
-  statusList: [
-    { status: 1 },
-    { status: 0 }
-  ],
-  categoryList: [
-    { value: 'security_event', label: 'Security Event' }/* ,
-    { value: 'performance_event', label: 'Performance Event' } */
-  ],
-  eventTypeList: [
-    { value: 'Initial Access', label: 'Initial Access' },
-    { value: 'Command and Control', label: 'Command and Control' },
-    { value: 'Credential Access', label: 'Credential Access' },
-    { value: 'Lateral Movement', label: 'Lateral Movement' },
-    { value: 'Collection', label: 'Collection' },
-    { value: 'Impact', label: 'Impact' },
-    { value: 'Anonymity', label: 'Anonymity' },
-    { value: 'Regulatory Risk', label: 'Regulatory Risk' }
-  ],
-  sourceList: [
-    { value: 'session_record', label: 'Session Record' }
-  ],
-  levelList: [
-    { value: 'critical', label: 'Critical' },
-    { value: 'high', label: 'High' },
-    { value: 'medium', label: 'Medium' },
-    { value: 'low', label: 'Low' },
-    { value: 'info', label: 'Info' }
-  ],
-  metricList: [
-    { value: 'tcp_lostlen_ratio', label: 'Bits/second' },
-    { value: 's2c_byte_retrans_ratio', label: 'Packets/second' },
-    { value: 's2c_byte_retrans_ratio1', label: 'Sessions/second' }
-  ],
-  conditionList: [
-    { value: 'than', label: 'Greater Than' },
-    { value: 'less', label: 'Greater Less' },
-    { value: 'equal', label: 'Greater Equal' }
-  ],
-  libraryList: [
-    { value: 'library name', knowledgeId: 7, label: 'Library name' },
-    { value: 'library name1', knowledgeId: 8, label: 'Library name1' },
-    { value: 'library name2', knowledgeId: 9, label: 'Library name2' }
-  ],
-  intervalList: [
-    { value: 'hours', label: 'hours' },
-    { value: 'minutes', label: 'minutes' },
-    { value: 'seconds', label: 'seconds' }
-  ],
-  intervalListCN: [
-    { value: 'hours', label: '小时' },
-    { value: 'minutes', label: '分钟' },
-    { value: 'seconds', label: '秒' }
-  ]
-}
--- a/src/views/charts2/charts/npm/NpmEventsHeader.vue
+++ b/src/views/charts2/charts/npm/NpmEventsHeader.vue
@@ -3,7 +3,7 @@
  <div class="npm-header-body" v-for="(item, index) in chartData" :key=index>
    <div class="npm-header-body-severity">
      <div class="npm-header-body-severity-icon" :class="item.eventSeverity" :test-id="`icon${index}`"></div>
-      <div class="npm-header-body-severity-value" :test-id="`severity${index}`">{{item.eventSeverity}}</div>
+      <div class="npm-header-body-severity-value" :test-id="`severity${index}`">{{ $t(item.eventSeverity) }}</div>
    </div>
    <chart-error v-if="showError" tooltip :content="errorMsg" />
    <div v-else class="npm-header-body-total" :test-id="`total${index}`">{{item.count}}</div>
@@ -45,7 +45,7 @@ export default {
        endTime: this.timeFilter && this.timeFilter.endTime ? getSecond(this.timeFilter.endTime) : '',
        type: this.type
      }
-      /*this.toggleLoading(true)
+      /* this.toggleLoading(true)
      axios.get(api.npm.events.list, { params: params }).then(response => {
        const res = response.data
        if (response.status === 200) {
@@ -69,7 +69,7 @@ export default {
        this.errorMsg = this.errorMsgHandler(e)
      }).finally(() => {
        this.toggleLoading(false)
-      })*/
+      }) */
      this.toggleLoading(false)
    }
  },
--- a/src/views/detections/detectionPolicies/Index.vue
+++ b/src/views/detections/detectionPolicies/Index.vue
@@ -203,7 +203,6 @@ export default {
        }).catch(() => {
        })
      } else {
-        // todo 调用接口删除
        this.toggleLoading(true)
        axios.delete(api.detection.delete + '?ruleIds=' + ids).then(response => {
          if (response.status === 200) {
--- a/src/views/detections/detectionPolicies/PolicyDrawer.vue
+++ b/src/views/detections/detectionPolicies/PolicyDrawer.vue
@@ -31,7 +31,7 @@

            <div class="drawer-basic-function">
              <div class="detection-drawer-title">{{ $t('config.user.source') }}</div>
-              <div class="basic-function-value">{{ $_.get(detailData, 'category', '-') || '-' }}</div>
+              <div class="basic-function-value">{{ changeCategory(detailData.category) }}</div>
            </div>

            <div v-if="detailData.ruleType==='indicator_match'">
@@ -44,7 +44,7 @@
                <div class="detection-drawer-title">{{ $t('detection.level') }}</div>
                <div class="detection-drawer-title">
                  <div class="detection__icon" :style="`background-color: ${eventSeverityColor[detailData.ruleConfigObj.level]}`"></div>
-                  <div class="basic-function-value">{{ $_.get(detailData, 'ruleConfigObj.level', '-') || '-' }}</div>
+                  <div class="basic-function-value">{{ changeSecurityLevel(detailData.ruleConfigObj) }}</div>
                </div>
              </div>
            </div>
@@ -82,11 +82,11 @@
    <div class="detection-drawer-collapse" style="margin: 20px 0">
      <el-collapse v-model="activeTrigger">
        <el-collapse-item :title="$t('detection.create.trigger')" name="trigger">
-          <div class="drawer-collapse-content">
+          <div class="drawer-collapse-content" v-if="language==='en'">
            <div class="drawer-collapse-trigger">
              Triggered when conditions occur at least
              <span style="color: #046ECA">
-                {{ $_.get(detailData, 'ruleTriggerObj.atLeast', '-') || '-' }} time
+                {{ atLeast }} {{ times }}
              </span> in
              <span style="color: #046ECA">
                {{ getNumberFromStr($_.get(detailData, 'ruleTriggerObj.interval', '0')) || '-' }}
@@ -102,6 +102,26 @@
              </div>
            </div>
          </div>
+          <div class="drawer-collapse-content" v-if="language==='cn'">
+            <div class="drawer-collapse-trigger">
+              当条件为
+              <span style="color: #046ECA">
+                {{ getNumberFromStr($_.get(detailData, 'ruleTriggerObj.interval', '0')) || '-' }}
+                {{ changeValueToLabel(detailData.ruleTriggerObj) }}
+              </span>内至少出现
+              <span style="color: #046ECA">
+                {{ $_.get(detailData, 'ruleTriggerObj.atLeast', '-') || '-' }} 次
+              </span>时触发
+            </div>
+
+            <div class="drawer-basic-function">
+              <div class="detection-drawer-title">评估频率</div>
+              <div class="drawer-trigger-minutes">
+                {{ getNumberFromStr($_.get(detailData, 'ruleTriggerObj.resetInterval', '0')) || '-' }}
+                {{ changeValueToLabel(detailData.ruleTriggerObj) }}
+              </div>
+            </div>
+          </div>
        </el-collapse-item>
      </el-collapse>
    </div>
@@ -111,7 +131,7 @@

 <script>
 import { switchStatus, toUpperCaseByString } from '@/utils/tools'
-import { eventSeverityColor } from '@/utils/constants'
+import { detectionUnitList, eventSeverityColor, securityLevel, storageKey } from '@/utils/constants'
 import axios from 'axios'
 import { api } from '@/utils/api'

@@ -128,7 +148,10 @@ export default {
      activeTrigger: 'trigger',
      detailData: {},
      eventSeverityColor,
-      severityList: []
+      severityList: [],
+      language: 'en',
+      atLeast: 0,
+      times: 'time'
    }
  },
  watch: {
@@ -142,6 +165,9 @@ export default {
      }
    }
  },
+  mounted () {
+    this.language = localStorage.getItem(storageKey.language) || 'en'
+  },
  methods: {
    switchStatus,
    toUpperCaseByString,
@@ -159,8 +185,13 @@ export default {

      axios.get(`${api.detection.detail}/${this.drawerInfo.ruleId}`).then(res => {
        if (res.status === 200) {
-          const data = res.data.data
-          this.detailData = data
+          this.detailData = res.data.data
+          this.atLeast = this.$_.get(this.detailData, 'ruleTriggerObj.atLeast', '-')
+          if (!isNaN(this.atLeast) && this.atLeast > 1) {
+            this.times = 'times'
+          } else {
+            this.times = 'time'
+          }
        }
      }).catch(err => {
        console.error(err)
@@ -168,6 +199,50 @@ export default {
    },
    getNumberFromStr (str) {
      return str.match(/\d+(\.\d+)?/g)[0]
+    },
+    changeCategory (value) {
+      if (value) {
+        const obj = detectionUnitList.categoryList.find(d => d.value === value)
+        let label = value
+        if (obj) {
+          label = this.$t(obj.label)
+        }
+        return label
+      } else {
+        return '-'
+      }
+    },
+    changeSecurityLevel (config) {
+      if (config) {
+        if (config.level) {
+          const obj = securityLevel.find(d => d.value === config.level)
+          let label = config.level
+          if (obj) {
+            label = this.$t(obj.label)
+          }
+          return label
+        } else {
+          return '-'
+        }
+      } else {
+        return '-'
+      }
+    },
+    changeValueToLabel (config) {
+      if (config) {
+        if (config.intervalVal) {
+          const obj = detectionUnitList.intervalListCN.find(d => d.value === config.intervalVal)
+          let label = config.intervalVal
+          if (obj) {
+            label = this.$t(obj.label)
+          }
+          return label
+        } else {
+          return '-'
+        }
+      } else {
+        return '-'
+      }
    }
  }
 }
--- a/src/views/detections/detectionPolicies/PolicyFilter.vue
+++ b/src/views/detections/detectionPolicies/PolicyFilter.vue
@@ -20,7 +20,7 @@
        <div class="new-filter-content-content">
          <el-checkbox-group v-model="checkCategory" @change="onChangeCategory">
            <el-checkbox v-for="item in categoryList" :key="item.name" class="new-filter-content-checkbox" :label="item.name">
-              {{ item.name }}
+              {{ item.label }}
            </el-checkbox>
          </el-checkbox-group>
        </div>
@@ -31,7 +31,7 @@
        <div class="new-filter-content-content">
          <el-checkbox-group v-model="checkEventType" @change="onChangeCategory" style="display: flex;flex-direction: column">
            <el-checkbox v-for="item in eventTypeList" :key="item.name" class="new-filter-content-checkbox" :label="item.name">
-              {{ item.name }}
+              {{ item.label }}
            </el-checkbox>
          </el-checkbox-group>
        </div>
@@ -44,6 +44,7 @@
 import axios from 'axios'
 import { api } from '@/utils/api'
 import { switchStatus } from '@/utils/tools'
+import { detectionUnitList } from '@/utils/constants'

 export default {
  name: 'DetectionFilter',
@@ -81,13 +82,25 @@ export default {
          }

          if (data.categoryList) {
-            this.categoryList = data.categoryList
+            this.categoryList = []
+            data.categoryList.forEach(item => {
+              const obj = detectionUnitList.categoryList.find(d => d.value === item.name)
+              if (obj) {
+                this.categoryList.push({ ...item, label: this.$t(obj.label) })
+              }
+            })
          } else {
            this.categoryList = []
          }

          if (data.eventTypeList) {
-            this.eventTypeList = data.eventTypeList
+            this.eventTypeList = []
+            data.eventTypeList.forEach(item => {
+              const obj = detectionUnitList.eventTypeList.find(d => d.value === item.name)
+              if (obj) {
+                this.eventTypeList.push({ ...item, label: this.$t(obj.label) })
+              }
+            })
          } else {
            this.eventTypeList = []
          }
--- a/src/views/detections/detectionPolicies/PolicyTable.vue
+++ b/src/views/detections/detectionPolicies/PolicyTable.vue
@@ -53,6 +53,12 @@
            {{ $t(switchStatus(scope.row[item.prop])) }}
          </div>
        </template>
+        <template v-else-if="item.prop === 'category'">
+          {{ changeCategory(scope.row[item.prop]) }}
+        </template>
+        <template v-else-if="item.prop === 'eventType'">
+          {{ changeEventType(scope.row[item.prop]) }}
+        </template>
        <template v-else-if="item.prop === 'description'">
          <div style="padding-right: 20px">{{ scope.row[item.prop] }}</div>
        </template>
@@ -78,6 +84,7 @@ import table from '@/mixins/table'
 import { dateFormatByAppearance } from '@/utils/date-util'
 import { switchStatus } from '@/utils/tools'
 import _ from 'lodash'
+import { detectionUnitList } from '@/utils/constants'

 export default {
  name: 'DetectionTable',
@@ -128,15 +135,13 @@ export default {
          show: true
        },
        {
-          // label: this.$t('config.user.createTime'),
-          label: 'Dimensions',
+          label: this.$t('detection.create.dimensions'),
          prop: 'dimensions',
          minWidth: 204,
          show: true
        },
        {
-          // label: this.$t('config.user.createTime'),
-          label: 'Library',
+          label: this.$t('detection.library'),
          prop: 'library',
          minWidth: 204,
          show: true
@@ -166,6 +171,26 @@ export default {
    switchStatus,
    rowDoubleClick (data) {
      this.$emit('rowDoubleClick', data)
+    },
+    changeCategory (value) {
+      if (value) {
+        const obj = detectionUnitList.categoryList.find(d => d.value === value)
+        let label = value
+        if (obj) {
+          label = this.$t(obj.label)
+        }
+        return label
+      }
+    },
+    changeEventType (value) {
+      if (value) {
+        const obj = detectionUnitList.eventTypeList.find(d => d.value === value)
+        let label = value
+        if (obj) {
+          label = this.$t(obj.label)
+        }
+        return label
+      }
    }
  }
 }
--- a/src/views/detections/overview/DetectionSecurityEventOverview.vue
+++ b/src/views/detections/overview/DetectionSecurityEventOverview.vue
@@ -75,8 +75,8 @@
          <div class="row__content" v-if="$_.get(basicInfo, 'domainInfo.category.reputationLevel')">
            <div
                class="row__tag row__tag__level"
-                :style="`background-color:${eventSeverityColor[basicInfo.domainInfo.category.reputationLevel]}`">
-              {{ basicInfo.domainInfo.category.reputationLevel }}
+                :style="`background-color:${riskLevelColor1[basicInfo.domainInfo.category.reputationLevel]}`">
+              {{ reputationLevel(basicInfo.domainInfo.category.reputationLevel) || '-' }}
            </div>
          </div>
          <div class="row__content" v-else>-</div>
@@ -346,7 +346,7 @@
 import axios from 'axios'
 import { api } from '@/utils/api'
 import { getMillisecond, dateFormatByAppearance } from '@/utils/date-util'
-import { eventSeverityColor, unitTypes, countryNameIdMapping, riskLevelMapping, riskLevelColor } from '@/utils/constants'
+import { eventSeverityColor, unitTypes, countryNameIdMapping, riskLevelMapping, riskLevelColor, riskLevelColor1 } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import _ from 'lodash'
 export default {
@@ -358,6 +358,7 @@ export default {
    return {
      eventSeverityColor,
      riskLevelColor,
+      riskLevelColor1,
      basicInfo: {},
      events: [],
      reference: 'https://attack.mitre.org',
@@ -391,7 +392,15 @@ export default {
        const m = riskLevelMapping.find(mapping => {
          return mapping.value == level
        })
-        return (m && m.name) || level
+        return (m && this.$t(m.label)) || level
+      }
+    },
+    reputationLevel () {
+      return function (level) {
+        const m = riskLevelMapping.find(mapping => {
+          return mapping.name == level
+        })
+        return (m && this.$t(m.label)) || level
      }
    },
    locationRegion (info) {