From 0fb496c3491b9791a8e8c384b8b84b6de7418552 Mon Sep 17 00:00:00 2001 From: "@changcode" Date: Thu, 10 Nov 2022 17:20:00 +0800 Subject: [PATCH] =?UTF-8?q?CN-789=20fix:=20=E4=BF=AE=E5=A4=8DNPM=20ip?= =?UTF-8?q?=E4=B8=8B=E9=92=BB=E5=90=8E=EF=BC=8C=E9=A1=B6=E9=83=A8=E7=9A=84?= =?UTF-8?q?=E5=88=86=E6=95=B0=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/charts2/Panel.vue | 59 ++++++++++++++++++- .../charts2/charts/npm/NpmNetworkQuantity.vue | 34 ++--------- 2 files changed, 61 insertions(+), 32 deletions(-) diff --git a/src/views/charts2/Panel.vue b/src/views/charts2/Panel.vue index 31cbfe26..d434cf9b 100644 --- a/src/views/charts2/Panel.vue +++ b/src/views/charts2/Panel.vue @@ -63,12 +63,13 @@ import { drillDownPanelTypeMapping, metricOptions } from '@/utils/constants' -import { getPanelList, getChartList } from '@/utils/api' +import { getPanelList, getChartList, api } from '@/utils/api' import { getNowTime, getSecond } from '@/utils/date-util' import { getTypeCategory } from '@/views/charts/charts/tools' -import { urlParamsHandler, overwriteUrl, getDnsMapData } from '@/utils/tools' +import { urlParamsHandler, overwriteUrl, getDnsMapData, computeScore } from '@/utils/tools' import ChartList from '@/views/charts2/ChartList' import { useStore } from 'vuex' +import { get } from '@/utils/http' export default { name: 'Panel', @@ -183,6 +184,7 @@ export default { return chart }) }) + this.scoreCalculation() }, setup (props, ctx) { // todo 目前在panel页面测试，后续会挪到router里 @@ -249,13 +251,18 @@ export default { const metric = ref(query.metric || 'Bits/s') + const queryCondition = ref(query.queryCondition || '') + const dimensionType = ref(query.dimensionType || '') + return { panelType, panel, timeFilter, showScore, metric, - path + path, + queryCondition, + dimensionType } }, methods: { @@ -325,6 +332,52 @@ export default { metric: value }) overwriteUrl(newUrl) + }, + scoreCalculation () { + let condition = '' + if (this.queryCondition.indexOf(' OR ') > -1) { + condition = this.queryCondition.split(/["|'](.*?)["|']/) + } else { + condition = this.queryCondition + } + const type = this.dimensionType + const params = { + startTime: getSecond(this.timeFilter.startTime), + endTime: getSecond(this.timeFilter.endTime), + cycle: 0 + } + if (condition && (typeof condition !== 'object') && type) { + params.q = condition + params.type = type + } else if (condition.length > 1 && type && type === 'ip') { + params.q = `${type}='${condition[1]}'` + params.type = type + } else if (condition.length > 1 && type && type !== 'ip') { + if (type === 'country' || type === 'asn' || type === 'province' || type === 'city' || type === 'isp') { + params.q = `${type}='${condition[1]}'` + params.type = type + } else if (type === 'idcRenter') { + params.q = `idc_renter='${condition[1]}'` + params.type = type + } else { + params.q = `${condition[0]}'${condition[1]}'` + params.type = type + } + } + if (type && condition) { + get(api.npm.overview.networkAnalysis, params).then(res => { + if (res.code === 200) { + const data = { + establishLatencyMs: res.data.result.establishLatencyMsAvg || null, + httpResponseLatency: res.data.result.httpResponseLatencyAvg || null, + sslConLatency: res.data.result.sslConLatencyAvg || null, + tcpLostlenPercent: res.data.result.tcpLostlenPercentAvg || null, + pktRetransPercent: res.data.result.pktRetransPercentAvg || null + } + this.score = computeScore(data) + } + }) + } } }, /** diff --git a/src/views/charts2/charts/npm/NpmNetworkQuantity.vue b/src/views/charts2/charts/npm/NpmNetworkQuantity.vue index ab92a343..2b08957d 100644 --- a/src/views/charts2/charts/npm/NpmNetworkQuantity.vue +++ b/src/views/charts2/charts/npm/NpmNetworkQuantity.vue @@ -57,24 +57,21 @@ export default { }, methods: { npmNetworkCycleQuery () { - // const conditionStr = this.$route.query.queryCondition ? this.$route.query.queryCondition : '' let condition = '' if (this.queryCondition.indexOf(' OR ') > -1) { condition = this.queryCondition.split(/["|'](.*?)["|']/) } else { condition = this.queryCondition } - // const type = this.$store.getters.getDimensionType - // const type = this.$route.query.dimensionType ? this.$route.query.dimensionType : '' const type = this.dimensionType const params = { startTime: getSecond(this.timeFilter.startTime), endTime: getSecond(this.timeFilter.endTime), cycle: 0 } - if (this.chartData.id === 23) { + if (this.chartData.name === 'npm-ip下钻-client-多单值') { this.side = 'client' - } else if (this.chartData.id === 26) { + } else if (this.chartData.name === 'npm-ip下钻-server-多单值') { this.side = 'server' } if (condition && (typeof condition !== 'object') && type) { @@ -98,20 +95,10 @@ export default { if (type && condition) { this.toggleLoading(true) get(api.npm.overview.networkAnalysis, params).then(res => { - let score = 0 if (res.code === 200) { - const data = { - establishLatencyMs: res.data.result.establishLatencyMsAvg || null, - httpResponseLatency: res.data.result.httpResponseLatencyAvg || null, - sslConLatency: res.data.result.sslConLatencyAvg || null, - tcpLostlenPercent: res.data.result.tcpLostlenPercentAvg || null, - pktRetransPercent: res.data.result.pktRetransPercentAvg || null - } - score = computeScore(data) this.npmNetworkCycleData = res.data.result - this.npmNetworkLastCycleQuery() } - this.$store.commit('setNpmThirdLevelMenuScore', score) + this.npmNetworkLastCycleQuery() }).catch(e => { this.toggleLoading(false) }) @@ -124,21 +111,11 @@ export default { this.toggleLoading(true) Promise.all([tcp, http, ssl, tcpPercent, packetPercent]).then(res => { this.npmNetworkCycleData = [] - let score = 0 res.forEach(t => { if (t.code === 200) { this.npmNetworkCycleData.push(t.data.result) - const data = { - establishLatencyMs: t.data.result.establishLatencyMsAvg, - httpResponseLatency: t.data.result.httpResponseLatencyAvg, - sslConLatency: t.data.result.sslConLatencyAvg, - tcpLostlenPercent: t.data.result.tcpLostlenPercentAvg, - pktRetransPercent: t.data.result.pktRetransPercentAvg - } - score = computeScore(data) } }) - this.$store.commit('setNpmThirdLevelMenuScore', score) this.npmNetworkLastCycleQuery() }).catch(e => { this.toggleLoading(false) @@ -152,16 +129,15 @@ export default { } else { condition = this.queryCondition } - // const type = this.$store.getters.getDimensionType const type = this.dimensionType const params = { startTime: getSecond(this.timeFilter.startTime), endTime: getSecond(this.timeFilter.endTime), cycle: 1 } - if (this.chartData.id === 23) { + if (this.chartData.name === 'npm-ip下钻-client-多单值') { this.side = 'client' - } else if (this.chartData.id === 26) { + } else if (this.chartData.name === 'npm-ip下钻-server-多单值') { this.side = 'server' } if (condition && (typeof condition !== 'object') && type) {