fix: 1、搜索组件有关枚举的添加国际化；2、修复tag模式下切换key，value还保留上次选择的问题；3、修复切换语言环境，搜索参数包含其他语言导致不能识别转换的问题

src/components/advancedSearch/TagMode.vue

@@ -273,6 +273,25 @@ export default {
           if (!meta.operator.value) {
             meta.operator.isEditing = true
             meta.operator.show = true
+          } else {
+            // 切换column，清除上次column选择的value，包含枚举的则删除，in操作符的让类型回归array
+            meta.value.value = ''
+            meta.value.label = ''
+            meta.value.isEditing = true
+            meta.value.show = true
+            const obj = enumerateData.find(d => d.name === meta.column.label)
+            if (obj) {
+              meta.doc = obj
+              if (this.$refs.valuesSelect) {
+                // 触发focus后，select弹窗并没有生效
+                this.$refs.valuesSelect[0].focus(meta)
+              }
+            } else {
+              delete meta.doc
+            }
+            if (meta.operator.value.toLowerCase() === 'in') {
+              meta.column.type = columnType.array
+            }
           }
         }, 200)
       }

src/components/advancedSearch/meta/parser.js

@@ -4,6 +4,7 @@ import ParserError, { errorDesc, errorTypes } from '@/components/advancedSearch/
 import _ from 'lodash'
 import { ElMessage } from 'element-plus'
 import i18n from '@/i18n'
+import store from '@/store'
 
 const strReg = {
   // 需要不限制语言，正则过滤中英日俄语出错实现语言都通过。留个记录观察，后续校验
@@ -1500,12 +1501,23 @@ export default class Parser {
         searchList.forEach((item, index) => {
           const obj = this.columnList.find(d => item.indexOf(d.label) > -1)
           if (obj && obj.doc.data) {
-            obj.doc.data.forEach(item1 => {
+            for (let i = 0; i < obj.doc.data.length; i++) {
+              const item1 = obj.doc.data[i]
               if (item.indexOf(item1.code) > -1) {
                 searchList[index] = searchList[index].replace(new RegExp(item1.code, 'g'), item1.value)
+                // 匹配到code，终止匹配
+                break
+              } else {
+                // 该操作是避免中文参数切换到英文环境时，code经i18n转为英文，匹配不到中文参数的情况
+                Object.keys(store.state.i18nObj).forEach(lang => {
+                  const i18nCode = store.state.i18nObj[lang][item1.code1]
+                  if (item.indexOf(i18nCode) > -1) {
+                    searchList[index] = searchList[index].replace(new RegExp(i18nCode, 'g'), item1.value)
                   }
                 })
               }
+            }
+          }
         })
         key = searchList.join(' AND ')
         return key

src/components/advancedSearch/showhint/Hint/HelperInfo.vue

@@ -82,21 +82,21 @@ export default {
 
       let searchKey = hintSearch.toUpperCase() || ''
       searchKey = searchKey.trim()
-      if (functionTips[searchKey]) {
+      // if (functionTips[searchKey]) {
-        return functionTips[searchKey].description
+      //   return functionTips[searchKey].description
-      }
+      // }
       if (operatorTips[searchKey]) {
         return operatorTips[searchKey].description
       }
-      if (sqlTips[searchKey]) {
+      // if (sqlTips[searchKey]) {
-        return sqlTips[searchKey].description
+      //   return sqlTips[searchKey].description
-      }
+      // }
       if (filterTips[searchKey]) {
         return filterTips[searchKey].description
       }
-      if (varTips[searchKey]) {
+      // if (varTips[searchKey]) {
-        return varTips[searchKey].description
+      //   return varTips[searchKey].description
-      }
+      // }
 
       // 完整的匹配关键字
       if (this.getDataset()) {

src/i18n/index.js

@@ -11,6 +11,7 @@ export async function loadI18n () {
     const items = await getI18n()
     if (items) {
       store.commit('loadI18n')
+      store.state.i18nObj = items
       Object.keys(items).forEach(lang => {
         i18n.global.mergeLocaleMessage(lang, items[lang])
       })

src/store/index.js

@@ -12,7 +12,8 @@ const store = createStore({
       i18n: false,
       showEntityTypeSelector: false, // 在entity explore页面时，控制header显示实体类型选择框
       from: '', // entity type
-      test: 'jest' // 用于单测的demo
+      test: 'jest', // 用于单测的demo
+      i18nObj: {} // 存放i18n的值，用于搜索组件切换环境时参数包含其他语言时使用的
     }
   },
   getters: {

src/utils/static-data.js

@@ -426,8 +426,8 @@ export const enumerateData = [
   {
     name: 'status',
     data: [
-      { code: 'Ended', value: 1 },
+      { code: _this.$t('detections.ended'), code1: 'detections.ended', value: 1 },
-      { code: 'Active', value: 0 }
+      { code: _this.$t('detections.active'), code1: 'detections.active', value: 0 }
     ]
   },
   {
@@ -446,11 +446,11 @@ export const enumerateData = [
   {
     name: 'severity',
     data: [
-      { code: 'critical', value: 'critical' },
+      { code: _this.$t('overall.critical'), code1: 'overall.critical', value: 'critical' },
-      { code: 'high', value: 'high' },
+      { code: _this.$t('overall.high'), code1: 'overall.high', value: 'high' },
-      { code: 'Medium', value: 'Medium' },
+      { code: _this.$t('overall.medium'), code1: 'overall.medium', value: 'medium' },
-      { code: 'low', value: 'low' },
+      { code: _this.$t('overall.low'), code1: 'overall.low', value: 'low' },
-      { code: 'info', value: 'info' }
+      { code: _this.$t('overall.info'), code1: 'overall.info', value: 'info' }
     ]
   }
 ]

src/utils/tools.js

@@ -1,7 +1,7 @@
 import { ElMessageBox, ElMessage } from 'element-plus'
 import i18n from '@/i18n'
 import _ from 'lodash'
-import { storageKey, iso36112, topDomain, echartsFontSize, dbGeoDataTableName, networkTable, dbDrilldownTableConfig, ZH, EN } from '@/utils/constants'
+import { storageKey, iso36112, topDomain, echartsFontSize, dbGeoDataTableName, networkTable, dbDrilldownTableConfig, ZH, EN, securityLevel } from '@/utils/constants'
 import { getIso36112JsonData, getDictList } from '@/utils/api'
 import { format } from 'echarts'
 import router from '@/router'
@@ -1447,3 +1447,19 @@ export const changeTimeByDate = (date) => {
     }
   }
 }
+
+/**
+ * 转换严重程度severity的国际化值
+ */
+export const changeI18nOfSeverity = (severity) => {
+  if (severity) {
+    const obj = securityLevel.find(d => d.value === severity)
+    if (obj) {
+      return i18n.global.t(obj.label)
+    } else {
+      return severity
+    }
+  } else {
+    return '-'
+  }
+}

src/views/detections/DetectionRow.vue

@@ -33,7 +33,7 @@
               <div class="basic-info__item" v-if="detection.severity">
                 <i class="cn-icon cn-icon-severity-level"></i>
                 <span>{{$t('detection.list.security')}}&nbsp;:&nbsp;&nbsp;</span>
-                <span>{{detection.severity || '-'}}</span>
+                <span>{{changeI18nOfSeverity(detection.severity)}}</span>
               </div>
               <div class="basic-info__item" v-if="detection.eventSeverity">
                 <i class="cn-icon cn-icon-severity-level"></i>
@@ -116,7 +116,7 @@ import DetectionSecurityEventOverview from '@/views/detections/overview/Detectio
 import DetectionPerformanceEventIpOverview from '@/views/detections/overview/DetectionPerformanceEventIpOverview'
 import DetectionPerformanceEventAppOverview from '@/views/detections/overview/DetectionPerformanceEventAppOverview'
 import DetectionPerformanceEventDomainOverview from '@/views/detections/overview/DetectionPerformanceEventDomainOverview'
-import { overwriteUrl, urlParamsHandler } from '@/utils/tools'
+import { overwriteUrl, urlParamsHandler, changeI18nOfSeverity } from '@/utils/tools'
 export default {
   name: 'DetectionRow',
   components: {
@@ -189,6 +189,7 @@ export default {
     unitConvert,
     getMillisecond,
     dateFormatByAppearance,
+    changeI18nOfSeverity,
     /* 切换折叠状态 */
     switchCollapse () {
       this.isCollapse = !this.isCollapse

src/views/detections/Index.vue

@@ -133,7 +133,7 @@ import {
 } from '@/views/detections/options/detectionOptions'
 import { api } from '@/utils/api'
 import axios from 'axios'
-import { urlParamsHandler, overwriteUrl, extensionEchartY, reverseSortBy } from '@/utils/tools'
+import { urlParamsHandler, overwriteUrl, extensionEchartY, reverseSortBy, changeI18nOfSeverity } from '@/utils/tools'
 import { useRoute } from 'vue-router'
 import Loading from '@/components/common/Loading'
 import ChartTabs from '@/components/common/ChartTabs'
@@ -313,12 +313,12 @@ export default {
         if (!this.$_.isEmpty(data)) {
           const dataMap = new Map()
           data.forEach(item => {
-            if (item.severity) {
+            if (changeI18nOfSeverity(item.severity)) {
-              if (!dataMap.has(item.severity)) {
+              if (!dataMap.has(changeI18nOfSeverity(item.severity))) {
                 const count = [[getMillisecond(parseFloat(item.statTime)), item.count]]
-                dataMap.set(item.severity, count)
+                dataMap.set(changeI18nOfSeverity(item.severity), count)
               } else {
-                dataMap.get(item.severity).push([getMillisecond(parseFloat(item.statTime)), item.count])
+                dataMap.get(changeI18nOfSeverity(item.severity)).push([getMillisecond(parseFloat(item.statTime)), item.count])
               }
             }
           })
@@ -337,6 +337,7 @@ export default {
           })
 
           eventSeverityTrendOption.series.forEach(serie => {
+            serie.name = changeI18nOfSeverity(serie.name)
             const seriesData = []
             xData.forEach(item => {
               if (dataMap.has(serie.name)) {
@@ -388,11 +389,11 @@ export default {
         }
         this.statisticsSeverityData = data
         if (!this.$_.isEmpty(data)) {
-          this.filterData[this.pageType][1].data = data.map(r => ({ label: r.severity, value: r.severity, count: r.count }))
+          this.filterData[this.pageType][1].data = data.map(r => ({ label: changeI18nOfSeverity(r.severity), value: r.severity, count: r.count }))
           this.isCheckFilterByQ(params, 1)
           const eventSeverityOption = this.$_.cloneDeep(pieForSeverity)
           eventSeverityOption.series[0].data = data.map(d => {
-            return { value: d.count, name: d.severity, itemStyle: { color: getSeverityColor(d.severity) } }
+            return { value: d.count, name: changeI18nOfSeverity(d.severity), itemStyle: { color: getSeverityColor(d.severity) } }
           })
           const chartDom = document.getElementById(`eventSeverityPie${this.pageType}`)
           let detectionChart = echarts.getInstanceByDom(chartDom)

src/views/detections/overview/DetectionSecurityEventOverview.vue

@@ -143,7 +143,7 @@
           <div class="row__content row__content--link" v-if="$_.get(detection, 'malware.reference')">
             {{ detection.malware.reference }}
           </div>
-          <div class="row__content">-</div>
+          <div class="row__content" v-else>-</div>
         </div>
       </template>
       <template v-else-if="detection.darkweb">
@@ -315,7 +315,7 @@
                   class="cn-icon cn-icon-alert-level"
                   :style="`color:${eventSeverityColor[event.severity]}`"
                 ></i>
-                <span>{{ event.severity }}</span>
+                <span>{{ changeI18nOfSeverity(event.severity) }}</span>
               </div>
               <div class="timeline__security-type">{{ event.eventType }}</div>
               <div class="timeline__start-time">{{ dateFormatByAppearance(parseInt(event.startTime)) }}</div>
@@ -360,6 +360,7 @@ import { getMillisecond, dateFormatByAppearance } from '@/utils/date-util'
 import { eventSeverityColor, unitTypes, countryNameIdMapping, riskLevelMapping, riskLevelColor, riskLevelColor1 } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import _ from 'lodash'
+import { changeI18nOfSeverity } from '@/utils/tools'
 export default {
   name: 'DetectionOverview',
   props: {
@@ -440,6 +441,7 @@ export default {
   methods: {
     getMillisecond,
     dateFormatByAppearance,
+    changeI18nOfSeverity,
     /** 初始化实体详情 */
     initEntityDetail () {
       // 调接口查询攻击者和受害者IP、Domain、APP的更多信息；