fix: 修复detection列表和filter问题：1、搜索栏清除搜索，勾选未去除；2、filter选项包含大写，点击搜索时报错；3、搜索包含空格导致搜索失败；4、添加刷新保留状态

src/components/advancedSearch/meta/parser.js

@@ -1173,7 +1173,9 @@ export default class Parser {
       const arr = []
       // 如果出现this.columnList中的字段，如IP\Domain\App\Country等，则不进行模糊搜索，将str返回出去
       this.columnList.forEach(item => {
-        arr.push(item.label.toLowerCase())
+        // todo 取消了大小写校验，后续观察是否出现问题
+        // arr.push(item.label.toLowerCase())
+        arr.push(item.label)
       })
 
       // 因为手动输入时可能会输入and，所以将操作符的AND转换为and，统一处理
@@ -1183,7 +1185,9 @@ export default class Parser {
         newStr = newStr.replace(new RegExp(arr[i], 'g'), arr[i])
       }
       // 检查str字段在arr中是否出现,true为出现过
-      const result = arr.some(item => newStr.toLowerCase().includes(item))
+      // todo 取消了大小写校验，后续观察是否出现问题
+      // const result = arr.some(item => newStr.toLowerCase().includes(item))
+      const result = arr.some(item => newStr.includes(item))
       if (newStr.indexOf(' and ') > -1) {
         // 将单引号包裹的and拿出来放到数组tempList里，原来的单引号包裹内容用temp即'it is test keyword{键值}'代替
         // 再将字符串用and转换为数组，遍历数组，发现值为temp的，获取键值，根据键值获取tempList的值组合起来，
@@ -1194,7 +1198,7 @@ export default class Parser {
 
         // 将单引号包裹的and内容集合起来
         while ((match = regex.exec(newStr)) !== null) {
-          if (match[1].includes('and')) {
+          if (match[1].includes(' and ')) {
             tempList.push(match[1])
           }
         }

src/store/modules/user.js

@@ -118,7 +118,7 @@ const user = {
           localStorage.setItem(storageKey.linkInfo, res.page.list[0].cvalue)
         }
       })
-      axios.get(api.config, { params: { ckey: 'schema_entity_explore' } }).then(response => {
+      axios.get(api.config, { params: { ckey: 'schema_explore' } }).then(response => {
         const res = response.data
         if (response.status === 200 && res.page.list && res.page.list.length > 0) {
           localStorage.setItem(storageKey.schemaEntityExplore, res.page.list[0].cvalue)

src/views/detections/DetectionList.vue

@@ -69,14 +69,16 @@ export default {
         this.myListData.push(this.$_.cloneDeep(item))
         if (item.eventInfoObj) {
           axios.get(`${api.detection.securityEvent.detail}/${item.eventInfoObj.ioc_type}?resource=${item.eventInfoObj.ioc_value}`).then(res => {
-            if (res.status === 200) {
+            if (res.status === 200 && this.myListData[i]) {
               this.myListData[i].malwareName = (this.$_.get(res, 'data.data.malware.malwareName', '-')) || '-'
-            } else {
+            } else if (this.myListData[i]) {
               this.myListData[i].malwareName = '-'
             }
           }).catch(e => {
             console.error(e)
-            this.myListData[i].malwareName = '-'
+            if (this.myListData[i]) {
+              this.myListData[i].malwareName = '-'
+            }
           })
         }
       })
@@ -116,7 +118,10 @@ export default {
         } else {
           clearTimeout(this.timeout)
           this.noData = false
-          this.initData()
+          const timer = setTimeout(() => {
+            this.initData()
+            clearTimeout(timer)
+          }, 200)
         }
       }
     }

src/views/detections/Index.vue

@@ -184,8 +184,8 @@ export default {
         securityEvent: [
           {
             title: this.$t('overall.status'),
-            column: '',
+            column: 'status',
-            topColumn: '', // todo schema暂无标识
+            topColumn: 'status',
             collapse: false,
             value: [], // value之间是or的关系
             data: [] // 从接口动态获取，本项在获得数据后需要特殊处理左边框颜色
@@ -303,6 +303,7 @@ export default {
             }
             return { label, value: r.status, count: r.count }
           })
+          this.isCheckFilterByQ(params, 0)
         }
       }).catch(e => {
         console.error(e)
@@ -390,6 +391,7 @@ 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.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) } }
@@ -408,7 +410,7 @@ export default {
             if (this.pageType === 'performanceEvent') {
               vm.filterData.performanceEvent[0].value = vm.triggerFilterDataValue(vm.filterData.performanceEvent[0].value, e.data.name)
             } else if (this.pageType === 'securityEvent') {
-              vm.filterData.securityEvent[0].value = vm.triggerFilterDataValue(vm.filterData.securityEvent[0].value, e.data.name)
+              vm.filterData.securityEvent[1].value = vm.triggerFilterDataValue(vm.filterData.securityEvent[1].value, e.data.name)
             }
           })
         }
@@ -464,6 +466,7 @@ export default {
             value: r.eventType,
             count: r.count
           }))
+          this.isCheckFilterByQ(params, 2)
           const chartDom = document.getElementById(`detectionCategoryPer${this.pageType}`)
           let detectionChart = echarts.getInstanceByDom(chartDom)
           if (detectionChart) {
@@ -500,6 +503,7 @@ export default {
             value: r.offenderIp,
             count: r.count
           }))
+          this.isCheckFilterByQ(params, 4)
           const { showMore, showIndex } = this.computeFilterPage(this.filterData[this.pageType][4].data)
           this.filterData[this.pageType][4].showMore = showMore
           this.filterData[this.pageType][4].showIndex = showIndex
@@ -538,6 +542,7 @@ export default {
       axios.get(api.detection[this.pageType].victimIpStatistics, { params }).then(res => {
         const data = res.data.data.result
         this.filterData[this.pageType][3].data = data.map(r => ({ label: r.victimIp, value: r.victimIp, count: r.count }))
+        this.isCheckFilterByQ(params, 3)
         const { showMore, showIndex } = this.computeFilterPage(this.filterData[this.pageType][3].data)
         this.filterData[this.pageType][3].showMore = showMore
         this.filterData[this.pageType][3].showIndex = showIndex
@@ -719,10 +724,21 @@ export default {
       // 参数q，避免切换页码时，地址栏参数q为空
       let urlQ = ''
       if (param && param.str) {
-        urlQ = encodeURI(param.str)
+        // urlQ = encodeURI(param.str)
+        urlQ = param.str
       } else if (this.q) {
-        urlQ = encodeURI(this.q)
+        // urlQ = encodeURI(this.q)
+        urlQ = this.q
       }
+      const mode = this.$route.query.mode || 'text'
+      const newUrl = urlParamsHandler(window.location.href, this.$route.query, {
+        startTime: this.timeFilter.startTime,
+        endTime: this.timeFilter.endTime,
+        range: this.dateRangeValue,
+        q: urlQ,
+        mode: mode
+      })
+      overwriteUrl(newUrl)
       this.queryFilter(urlQ)
       this.queryList(urlQ)
     },
@@ -749,8 +765,8 @@ export default {
         this.initVictimIpData(params)
         this.initSecurityTypeData(params)
       } else if (this.pageType === detectionPageType.performanceEvent) {
-        // this.initActiveEntity(params)
+        this.initActiveEntity(params)
-        // this.initEventTypeData(params)
+        this.initEventTypeData(params)
       }
     },
     pageSize (val) {
@@ -795,12 +811,43 @@ export default {
           t: +new Date()
         }
       })
+    },
+    isCheckFilterByQ (params, index) {
+      if (params.resource) {
+        let obj
+        if (index === 0) {
+          obj = this.filterData[this.pageType][index].data.find(d => params.resource.indexOf(d.value) > -1 && params.resource.indexOf('status') > -1)
+        } else {
+          obj = this.filterData[this.pageType][index].data.find(d => params.resource.indexOf(d.value) > -1)
+        }
+        if (obj) {
+          this.filterData[this.pageType][index].value = [obj.value]
+          this.filterData[this.pageType][index].flag = true
+        }
+      } else {
+        this.filterData[this.pageType][index].value = []
+        this.filterData[this.pageType][index].flag = true
+      }
     }
   },
   mounted () {
-    this.queryFilter()
+    let { q } = this.$route.query
+
+    // 如果地址栏有listMode，即列表页，并非首页，则开始搜索
+    if (q) {
+      // %位置为0是输入中文时能解码，%20，25%分别是空格和%的情况
+      if (q && (q.indexOf('%') === 0 || q.indexOf('%20') > -1 || q.indexOf('%25') > -1)) {
+        q = decodeURI(q)
+      }
+      // %位置不为0，即内容包含非英文时
+      const str1 = q.substring(q.indexOf('%'), q.indexOf('%') + 3)
+      if (q && q.indexOf('%') > 0 && (str1 !== '%20' || str1 === '%25')) {
+        q = decodeURI(q)
+      }
+    }
+    this.queryFilter(q)
     this.initFlag = false
-    this.queryList()
+    this.queryList(q)
     this.debounceFunc = this.$_.debounce(this.resize, 300)
     window.addEventListener('resize', this.debounceFunc)
   },
@@ -873,37 +920,61 @@ export default {
     'filterData.securityEvent.0.value': {
       deep: true,
       handler (n, o) {
-        this.$refs.search.changeParams({ column: this.filterData.securityEvent[0].column, oldValue: o, newValue: n })
+        if (!this.filterData.securityEvent[0].flag) {
+          this.$refs.search.changeParams({ column: this.filterData.securityEvent[0].column, oldValue: o, newValue: n })
+        } else {
+          this.filterData.securityEvent[0].flag = false
+        }
       }
     },
     'filterData.securityEvent.1.value': {
       deep: true,
       handler (n, o) {
-        this.$refs.search.changeParams({ column: this.filterData.securityEvent[1].column, oldValue: o, newValue: n })
+        if (!this.filterData.securityEvent[1].flag) {
+          this.$refs.search.changeParams({ column: this.filterData.securityEvent[1].column, oldValue: o, newValue: n })
+        } else {
+          this.filterData.securityEvent[1].flag = false
+        }
       }
     },
     'filterData.securityEvent.2.value': {
       deep: true,
       handler (n, o) {
-        this.$refs.search.changeParams({ column: this.filterData.securityEvent[2].column, oldValue: o, newValue: n })
+        if (!this.filterData.securityEvent[2].flag) {
+          this.$refs.search.changeParams({ column: this.filterData.securityEvent[2].column, oldValue: o, newValue: n })
+        } else {
+          this.filterData.securityEvent[2].flag = false
+        }
       }
     },
     'filterData.securityEvent.3.value': {
       deep: true,
       handler (n, o) {
-        this.$refs.search.changeParams({ column: this.filterData.securityEvent[3].column, oldValue: o, newValue: n })
+        if (!this.filterData.securityEvent[3].flag) {
+          this.$refs.search.changeParams({ column: this.filterData.securityEvent[3].column, oldValue: o, newValue: n })
+        } else {
+          this.filterData.securityEvent[3].flag = false
+        }
       }
     },
     'filterData.securityEvent.4.value': {
       deep: true,
       handler (n, o) {
-        this.$refs.search.changeParams({ column: this.filterData.securityEvent[4].column, oldValue: o, newValue: n })
+        if (!this.filterData.securityEvent[4].flag) {
+          this.$refs.search.changeParams({ column: this.filterData.securityEvent[4].column, oldValue: o, newValue: n })
+        } else {
+          this.filterData.securityEvent[4].flag = false
+        }
       }
     },
     'filterData.securityEvent.5.value': {
       deep: true,
       handler (n, o) {
-        this.$refs.search.changeParams({ column: this.filterData.securityEvent[5].column, oldValue: o, newValue: n })
+        if (!this.filterData.securityEvent[5].flag) {
+          this.$refs.search.changeParams({ column: this.filterData.securityEvent[5].column, oldValue: o, newValue: n })
+        } else {
+          this.filterData.securityEvent[5].flag = false
+        }
       }
     },
     'filterData.performanceEvent.0.value': {