fix: 修复detection左侧筛选有些无法选择的问题;

This commit is contained in:
chenjinsong
2022-03-07 20:50:03 +08:00
parent 97a6e893c6
commit 2d1419b74b
5 changed files with 34 additions and 20 deletions

View File

@@ -16,7 +16,7 @@
:chart-data="chartData"
:query-params="queryParams"
:entity="entity"
@query="query"
@getChartData="getChartData"
@showLoading="showLoading"
></chart-map>
@@ -366,6 +366,9 @@ export default {
getAlarmInfo (url, extraParams, isRefresh, timeFilter) {
this.$emit('getChartData', url, extraParams, isRefresh, timeFilter)
},
getChartData (url, extraParams) {
this.$emit('getChartData', url, extraParams)
},
initEchartsWithTable () {
this.$refs['chart' + this.chartInfo.id] &&
this.$refs['chart' + this.chartInfo.id].initEchartsWithTable(

View File

@@ -53,6 +53,7 @@ import {
isEcharts,
isSingleValue,
isTable,
isBasicTable,
isActiveIpTable,
isTitle,
isMap,
@@ -149,14 +150,6 @@ export default {
}
] // table的所有数据
},
table: {
pageSize: chartTableDefaultPageSize,
limit: chartTableTopOptions[0], // top-n
orderBy: 'sessions',
tableColumns: [], // table字段
tableData: [], // table的所有数据
currentPageData: [] // table当前页的数据
},
tabHandleClickType: ''
}
},
@@ -255,7 +248,7 @@ export default {
}
if (this.isTable) {
this.table.tableData = response.data.result
// this.table.tableColumns = chartParams.columns
this.table.tableColumns = chartParams.columns
// this.table.tableColumns = this.getTableTitle(response.data.result)
this.table.currentPageData = this.getTargetPageData(1, this.table.pageSize, this.table.tableData)
} else if (this.isSingleValue) {
@@ -405,7 +398,7 @@ export default {
const { startTime, endTime } = getNowTime(dateRangeValue)
const chartTimeFilter = ref({ startTime, endTime, dateRangeValue })
let table = {}
if (isTable(props.chartInfo.type)) {
if (isBasicTable(props.chartInfo.type)) {
table = {
pageSize: chartTableDefaultPageSize,
limit: chartTableTopOptions[0], // top-n

View File

@@ -14,7 +14,7 @@
class="legend__circle-marker"
:style="`background-color:${markerColors[index].background};border: 1px solid ${markerColors[index].border};`"
></div>
<div class="legend__value">{{legend.value}}</div>
<div class="legend__value">{{unitConvert(legend.value, unitTypes.number).join(' ')}}</div>
<div class="legend__name">{{legend.name}}</div>
</div>
</div>
@@ -25,17 +25,19 @@
import * as am4Core from '@amcharts/amcharts4/core'
import * as am4Maps from '@amcharts/amcharts4/maps'
import { getGeoData, replaceUrlPlaceholder } from '@/utils/tools'
import { storageKey, dnsServerRole } from '@/utils/constants'
import { storageKey, dnsServerRole, unitTypes } from '@/utils/constants'
import { isMapBlock, isMapPoint } from './tools'
import unitConvert, { valueToRangeValue } from '@/utils/unit-convert'
import { HeatLegend } from '@/components/amcharts/heatLegend'
import { getData } from '@/utils/api'
import chartMixin from './chart-mixin'
import _ from 'lodash'
export default {
name: 'ChartMap',
data () {
return {
unitTypes,
myChart: null,
mapPictureUrl: '/Tiles/{z}/{x}/{y}.png',
showMapBackButton: false,
@@ -62,15 +64,12 @@ export default {
name: this.$t('dns.publicRecursiveDomainServers'),
type: dnsServerRole.OPRDNS,
value: 0
}/*,
{
name: this.$t('dns.rootDomainServers'),
value: 0
},
{
name: this.$t('dns.rootDomainServers'),
name: this.$t('dns.selfBuiltDomainServers'),
type: dnsServerRole.SBDNS,
value: 0
} */
}
],
markerColors: [
{
@@ -102,6 +101,7 @@ export default {
},
mixins: [chartMixin],
methods: {
unitConvert,
initMap (id) {
const chart = am4Core.create(id, am4Maps.MapChart)
chart.geodata = getGeoData(storageKey.iso36112WorldLow)
@@ -144,6 +144,16 @@ export default {
}
}
})
// dns地图legend上的数据
if (!_.isEmpty(this.chartInfo.params.legendUrl)) {
setTimeout(() => {
this.chartInfo.params.legendUrl.forEach((url, i) => {
getData(url).then(data => {
this.legends[i].value = data
})
})
})
}
},
loadAm4ChartMap (polygonSeries, country, chartData) {
// chartData不为空是下钻
@@ -288,7 +298,7 @@ export default {
},
changeLegend (index) {
this.currentLegendIndex = index
this.$emit('query', { dnsServerRole: this.legends[index].type })
this.$emit('getChartData', null, { dnsServerRole: this.legends[index].type })
},
dnsTypeI18n (role) {
let i18n = ''

View File

@@ -31,6 +31,9 @@
<span v-else-if="c === 'packets' || c === 'sessions'">
{{unitConvert(row[c], unitTypes.number).join(' ')}}
</span>
<span v-else-if="c === 'responseFailRate'">
{{unitConvert(row[c] * 100, unitTypes.percent).join(' ')}}%
</span>
<span v-else>
{{row[c]}}
</span>

View File

@@ -40,6 +40,11 @@ export default {
type: 'string',
label: 'Security type'
},
{
name: 'event_type',
type: 'string',
label: 'Event type'
},
{
name: 'victim_ip',
type: 'string',