diff --git a/src/components/charts/ChartTableActiveIp.vue b/src/components/charts/ChartTableActiveIp.vue new file mode 100644 index 00000000..ee80460d --- /dev/null +++ b/src/components/charts/ChartTableActiveIp.vue @@ -0,0 +1,112 @@ + + + + + diff --git a/src/components/charts/chart-options.js b/src/components/charts/chart-options.js index f738b48a..7f186e37 100644 --- a/src/components/charts/chart-options.js +++ b/src/components/charts/chart-options.js @@ -543,6 +543,10 @@ export function isEchartsWithTable (type) { export function isTable (type) { return type >= 61 && type <= 70 } +/* table */ +export function isActiveIpTable (type) { + return type == 63 +} /* title */ export function isTitle (type) { return type === 93 diff --git a/src/components/rightBox/settings/ChartBox.vue b/src/components/rightBox/settings/ChartBox.vue index 29ad90fc..0b34caac 100644 --- a/src/components/rightBox/settings/ChartBox.vue +++ b/src/components/rightBox/settings/ChartBox.vue @@ -56,6 +56,7 @@ + @@ -229,8 +230,11 @@ export default { value: 62, label: 'table-2', remark: 'DNS记录' - }, - { + }, { + value: 63, + label: 'table-3', + remark: '挖矿活跃ip' + }, { value: 31, label: 'pie-1', remark: '饼图-带联动表格' @@ -400,4 +404,4 @@ export default { outline: none; } } - \ No newline at end of file + diff --git a/src/utils/constants.js b/src/utils/constants.js index 58dfbe35..ea6c7221 100644 --- a/src/utils/constants.js +++ b/src/utils/constants.js @@ -87,6 +87,7 @@ export const unitTypes = { export const chartTableDefaultPageSize = 10 // table类型图表默认每页数据量 export const chartTableTopOptions = [10, 100] // table类型图表的TOP-N选项 +export const chartActiveIpTableOrderOptions = ['machine'] // active ip table类型图表的order 选项 export const chartPieTableTopOptions = [{ name: 'Sessions', value: 'sessions' }, { name: 'Packets', value: 'packets' }, { name: 'Bytes', value: 'bytes' }] // table类型图表的TOP-N选项 export const iso36112 = { diff --git a/src/views/charts/Chart.vue b/src/views/charts/Chart.vue index f8afd6b1..4560cce7 100644 --- a/src/views/charts/Chart.vue +++ b/src/views/charts/Chart.vue @@ -235,6 +235,44 @@
+ + + + + + { this.loading = false }, 250) }) }, + + activeIpTableLimitChange () { + const chartParams = this.chartInfo.params || null // 图表参数 + this.initChartActiveIpTable(chartParams) + }, + initChartActiveIpTable (chartParams) { + const queryParams = { ...this.queryTimeRange, order: this.activeIpTable.orderBy, ...this.entity } + get(replaceUrlPlaceholder(chartParams.url, queryParams)).then(response => { + if (response.code === 200) { + if (this.$_.isEmpty(response.data.result)) { + this.noData = true + return + } else { + this.noData = false + } + this.activeIpTable.tableData = response.data.result + this.activeIpTable.tableColumns = this.getTableTitle(response.data.result) + this.activeIpTable.currentPageData = this.getTargetPageData(1, this.activeIpTable.pageSize, this.activeIpTable.tableData) + } else { + this.isError = true + this.noData = true + this.errorInfo = response.msg || response.message || this.$t('tip.unknownError') + } + }).finally(() => { + setTimeout(() => { this.loading = false }, 250) + }) + }, echartsResize () { this.myChart && this.myChart.resize() this.myChart2 && this.myChart2.resize() @@ -1858,6 +1956,7 @@ export default { chartInfo, layoutConstant, chartTableTopOptions, + chartActiveIpTableOrderOptions, chartPieTableTopOptions, isEcharts: isEcharts(props.chart.type), isEchartsWithTable: isEchartsWithTable(props.chart.type), @@ -1866,6 +1965,7 @@ export default { isSingleValueWithEcharts: isSingleValueWithEcharts(props.chart.type), isRelationShip: isRelationShip(props.chart.type), isTable: isTable(props.chart.type), + isActiveIpTable: isActiveIpTable(props.chart.type), isMap: isMap(props.chart.type), isTitle: isTitle(props.chart.type), isMapLine: isMapLine(props.chart.type),