gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CN-1263 network overview下钻查询条件变更

Browse Source
This commit is contained in:
hyx
2023-09-05 08:30:50 +08:00
parent baf157b253
commit 25d51d246c
7 changed files with 178 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/css/components/views/charts2/networkOverviewTabs.scss
View File

@@ -233,7 +233,7 @@
height: calc(100% - 40px);
border:none;
.el-table__body-wrapper {
height: calc(100% - 30px) !important;
height: calc(100% - 45px) !important;
}
}
}

26
src/components/layout/Header.vue
View File

@@ -628,11 +628,19 @@ export default {
}
// console.log(queryCondition.join(' AND '))
this.urlChangeParams[this.curTabState.queryCondition] = queryCondition.join(' AND ')
this.urlChangeParams[this.curTabState.lineQueryCondition] = queryCondition.join(' AND ')
} else {
searchProps.forEach(item => {
queryCondition.push(item + '=\'' + handleSpecialValue(value) + '\'')
})
this.urlChangeParams[this.curTabState.queryCondition] = queryCondition.join(' OR ')
const lineQueryCondition = []
if (curTab.lineQueryCondition) {
curTab.lineQueryCondition.forEach(item => {
lineQueryCondition.push(item.replaceAll('$param', value))
})
this.urlChangeParams[this.curTabState.lineQueryCondition] = lineQueryCondition.join(' OR ')
}
}
}
this.changeUrlTabState()
@@ -700,7 +708,7 @@ export default {
}
}
},
jump (route, columnName, columnValue, opeType) {
async jump (route, columnName, columnValue, opeType) {
if (route === '/panel/linkMonitor' && opeType === 3) {
return true
}
@@ -719,6 +727,9 @@ export default {
this.$store.commit('setNetworkOverviewTabList', [])
}
// 清空网络概况的特殊面包屑
const tableType = this.$route.params ? this.$route.params.typeName : 'networkOverview'
const metric = this.getUrlParam(this.curTabState.tableMetric, 'Bits/s')
const curTab = await getDefaultCurTab(tableType, metric, columnName)
this.$store.getters.menuList.forEach(menu => {
if (!this.$_.isEmpty(menu.children)) {
menu.children.forEach(child => {
@@ -740,16 +751,19 @@ export default {
this.urlChangeParams[this.curTabState.thirdMenu] = columnName
this.urlChangeParams[this.curTabState.fourthMenu] = ''
this.urlChangeParams[this.curTabState.panelName] = columnName
const tableType = this.$route.params ? this.$route.params.typeName : 'networkOverview'
const metric = this.getUrlParam(this.curTabState.tableMetric, 'Bits/s')
const curTab = getDefaultCurTab(tableType, metric, columnName)
if (curTab.thirdDimensionQueryCondition) {
this.urlChangeParams[this.curTabState.thirdDimensionQueryCondition] = curTab.thirdDimensionQueryCondition.join(' OR ')
}
if (curTab.lineThirdDimensionQueryCondition) {
this.urlChangeParams[this.curTabState.lineThirdDimensionQueryCondition] = curTab.lineThirdDimensionQueryCondition.join(' OR ')
}
this.urlChangeParams[this.curTabState.curTab] = curTab.prop
this.urlChangeParams[this.curTabState.dimensionType] = curTab ? curTab.prop : ''
this.$_.omit(this.urlChangeParams, [this.curTabState.queryCondition, this.curTabState.networkOverviewBeforeTab])
this.$_.omit(this.urlChangeParams, [this.curTabState.queryCondition, this.curTabState.networkOverviewBeforeTab, this.curTabState.lineQueryCondition])
} else {
child.columnName = ''
child.columnValue = ''
this.$_.omit(this.urlChangeParams, [this.curTabState.thirdPanel, this.curTabState.fourthPanel, this.curTabState.thirdMenu, this.curTabState.fourthMenu, this.curTabState.dimensionType, this.curTabState.panelName, this.curTabState.curTab, this.curTabState.queryCondition, this.curTabState.networkOverviewBeforeTab])
this.$_.omit(this.urlChangeParams, [this.curTabState.thirdPanel, this.curTabState.fourthPanel, this.curTabState.thirdMenu, this.curTabState.fourthMenu, this.curTabState.dimensionType, this.curTabState.panelName, this.curTabState.curTab, this.curTabState.queryCondition, this.curTabState.networkOverviewBeforeTab,, this.curTabState.lineThirdDimensionQueryCondition,, this.curTabState.thirdDimensionQueryCondition])
}
}
})

110
src/utils/constants.js
View File

@@ -435,6 +435,9 @@ export const curTabState = {
tableSortType: 'tableSortType',
tableSortTab: 'tableSortTab',
queryCondition: 'queryCondition',
thirdDimensionQueryCondition: 'thirdDimensionQueryCondition',
lineQueryCondition: 'lineQueryCondition',
lineThirdDimensionQueryCondition: 'lineThirdDimensionQueryCondition',
dimensionType: 'dimensionType', // 纬度
panelName: 'panelName',
thirdMenu: 'thirdMenu',
@@ -681,7 +684,10 @@ export const networkOverviewTabList = [
label: 'network.ips',
prop: 'ip',
queryCycleTotalProp: 'ips',
dillDownProp: ['common_client_ip', 'common_server_ip'],
dillDownProp: ['common_client_ip', 'common_server_ip'], // 下钻表格：查询条件q（dillDownProp里条件之间都是OR的关系）,或者queryCondition属性，queryCondition: ['ip = \'$param\' AND side = \'server\''],
thirdDimensionQueryCondition: ['notEmpty(common_client_ip) OR notEmpty(common_server_ip)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['ip = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(ip)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -690,6 +696,9 @@ export const networkOverviewTabList = [
prop: 'countryRegion',
queryCycleTotalProp: 'countries',
dillDownProp: ['client_country_region', 'server_country_region'],
thirdDimensionQueryCondition: ['notEmpty(client_country_region) OR notEmpty(server_country_region)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['country_region = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(country_region)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -698,6 +707,9 @@ export const networkOverviewTabList = [
prop: 'asn',
queryCycleTotalProp: 'asns',
dillDownProp: ['client_asn', 'server_asn'],
thirdDimensionQueryCondition: ['notEmpty(client_asn) OR notEmpty(server_asn)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['asn = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(asn)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -706,6 +718,9 @@ export const networkOverviewTabList = [
prop: 'appLabel',
queryCycleTotalProp: 'applications',
dillDownProp: ['common_app_label'],
thirdDimensionQueryCondition: ['notEmpty(common_app_label)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['common_app_label = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(common_app_label)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -714,6 +729,9 @@ export const networkOverviewTabList = [
prop: 'appCompany',
queryCycleTotalProp: 'providers',
dillDownProp: ['app_company'],
thirdDimensionQueryCondition: ['notEmpty(app_company)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['app_company = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(app_company)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -722,6 +740,9 @@ export const networkOverviewTabList = [
prop: 'domain',
queryCycleTotalProp: 'domains',
dillDownProp: ['domain'],
thirdDimensionQueryCondition: ['notEmpty(domain)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['domain = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(domain)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -730,6 +751,9 @@ export const networkOverviewTabList = [
prop: 'domainSld',
queryCycleTotalProp: 'domainSld',
dillDownProp: ['domain_sld'],
thirdDimensionQueryCondition: ['notEmpty(domain_sld)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['domain_sld = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(domain_sld)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -738,6 +762,9 @@ export const networkOverviewTabList = [
prop: 'l7Protocol',
queryCycleTotalProp: 'protocols',
dillDownProp: ['common_l7_protocol'],
thirdDimensionQueryCondition: ['notEmpty(common_l7_protocol)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['common_l7_protocol = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(common_l7_protocol)'], // 曲线图：第三级维度查询条件q
checked: true,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -746,6 +773,9 @@ export const networkOverviewTabList = [
prop: 'superAdminArea',
queryCycleTotalProp: 'regions',
dillDownProp: ['client_super_admin_area', 'server_super_admin_ area'],
thirdDimensionQueryCondition: ['notEmpty(client_super_admin_area) OR notEmpty(server_super_admin_area)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['super_admin_area = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(super_admin_area)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -754,6 +784,9 @@ export const networkOverviewTabList = [
prop: 'adminArea',
queryCycleTotalProp: 'cities',
dillDownProp: ['client_admin_area', 'server_admin_area'],
thirdDimensionQueryCondition: ['notEmpty(client_admin_area) OR notEmpty(server_admin_area)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['admin_area = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(admin_area)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -762,6 +795,9 @@ export const networkOverviewTabList = [
prop: 'isp',
queryCycleTotalProp: 'isps',
dillDownProp: ['client_isp', 'server_isp'],
thirdDimensionQueryCondition: ['notEmpty(client_isp) OR notEmpty(server_isp)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['isp = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(isp)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -770,6 +806,9 @@ export const networkOverviewTabList = [
prop: 'appSubcategory',
queryCycleTotalProp: 'applicationCategories',
dillDownProp: ['app_subcategory'],
thirdDimensionQueryCondition: ['notEmpty(app_subcategory)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['app_subcategory = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(app_subcategory)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -778,6 +817,9 @@ export const networkOverviewTabList = [
prop: 'domainCategoryName',
queryCycleTotalProp: 'domainCategories',
dillDownProp: ['domain_category_name'],
thirdDimensionQueryCondition: ['notEmpty(domain_category_name)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['domain_category_name = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(domain_category_name)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -786,6 +828,9 @@ export const networkOverviewTabList = [
prop: 'httpHost',
queryCycleTotalProp: 'hosts',
dillDownProp: ['http_host'],
thirdDimensionQueryCondition: ['notEmpty(http_host)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['http_host = \'$param\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(http_host)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -794,6 +839,9 @@ export const networkOverviewTabList = [
prop: 'protocolPort',
queryCycleTotalProp: 'protocolports',
dillDownProp: ['common_l7_protocol', 'common_server_port '],
thirdDimensionQueryCondition: ['notEmpty(common_l7_protocol)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['common_l7_protocol = \'$protocol_param\' AND common_server_port = $port_param'], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(common_l7_protocol)'], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -802,6 +850,9 @@ export const networkOverviewTabList = [
prop: 'clientIp',
queryCycleTotalProp: 'clientIps',
dillDownProp: ['common_client_ip'],
thirdDimensionQueryCondition: ['notEmpty(common_client_ip)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['ip = \'$param\' and side = \'client\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(ip) and side = \'client\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -810,6 +861,9 @@ export const networkOverviewTabList = [
prop: 'serverIp',
queryCycleTotalProp: 'serverIps',
dillDownProp: ['common_server_ip'],
thirdDimensionQueryCondition: ['notEmpty(common_server_ip)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['ip = \'$param\' and side = \'server\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(ip) and side = \'server\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -818,6 +872,9 @@ export const networkOverviewTabList = [
prop: 'clientCountryRegion',
queryCycleTotalProp: 'clientCountries',
dillDownProp: ['client_country_region'],
thirdDimensionQueryCondition: ['notEmpty(client_country_region)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['country_region = \'$param\' and side = \'client\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(country_region) and side = \'client\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -826,22 +883,31 @@ export const networkOverviewTabList = [
prop: 'serverCountryRegion',
queryCycleTotalProp: 'serverCountries',
dillDownProp: ['server_country_region'],
thirdDimensionQueryCondition: ['notEmpty(server_country_region)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['country_region = \'$param\' and side = \'server\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(country_region) and side = \'server\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
}, {
label: 'network.clientProvinces',
label: 'network.clientRegions',
prop: 'clientSuperAdminArea',
queryCycleTotalProp: 'clientProvinces',
dillDownProp: ['client_super_admin_area'],
thirdDimensionQueryCondition: ['notEmpty(client_super_admin_area)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['super_admin_area = \'$param\' and side = \'client\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(super_admin_area) and side = \'client\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
}, {
label: 'network.serverProvinces',
label: 'network.serverRegions',
prop: 'serverSuperAdminArea',
queryCycleTotalProp: 'serverProvinces',
dillDownProp: ['server_super_admin_area'],
thirdDimensionQueryCondition: ['notEmpty(server_super_admin_area)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['super_admin_area = \'$param\' and side = \'server\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(super_admin_area) and side = \'server\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -850,6 +916,9 @@ export const networkOverviewTabList = [
prop: 'clientAdminArea',
queryCycleTotalProp: 'clientCities',
dillDownProp: ['client_admin_area'],
thirdDimensionQueryCondition: ['notEmpty(client_admin_area)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['admin_area = \'$param\' and side = \'client\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(admin_area) and side = \'client\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -858,6 +927,9 @@ export const networkOverviewTabList = [
prop: 'serverAdminArea',
queryCycleTotalProp: 'serverCities',
dillDownProp: ['server_admin_area'],
thirdDimensionQueryCondition: ['notEmpty(server_admin_area)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['admin_area = \'$param\' and side = \'server\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(admin_area) and side = \'server\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -866,6 +938,9 @@ export const networkOverviewTabList = [
prop: 'clientIsp',
queryCycleTotalProp: 'clientIsps',
dillDownProp: ['client_isp'],
thirdDimensionQueryCondition: ['notEmpty(client_isp)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['isp = \'$param\' and side = \'client\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(isp) and side = \'client\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -874,6 +949,9 @@ export const networkOverviewTabList = [
prop: 'serverIsp',
queryCycleTotalProp: 'serverIsps',
dillDownProp: ['server_isp'],
thirdDimensionQueryCondition: ['notEmpty(server_isp)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['isp = \'$param\' and side = \'server\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(isp) and side = \'server\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -882,6 +960,9 @@ export const networkOverviewTabList = [
prop: 'clientAsn',
queryCycleTotalProp: 'clientAsns',
dillDownProp: ['client_asn'],
thirdDimensionQueryCondition: ['notEmpty(client_asn)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['asn = \'$param\' and side = \'client\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(asn) and side = \'client\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -890,6 +971,9 @@ export const networkOverviewTabList = [
prop: 'serverAsn',
queryCycleTotalProp: 'serverAsns',
dillDownProp: ['server_asn'],
thirdDimensionQueryCondition: ['notEmpty(server_asn)'], // 下钻表格：第三级维度查询条件q
lineQueryCondition: ['asn = \'$param\' and side = \'server\''], // 曲线图：查询条件q
lineThirdDimensionQueryCondition: ['notEmpty(asn) and side = \'server\''], // 曲线图：第三级维度查询条件q
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.networkOverview
@@ -1022,6 +1106,7 @@ export const networkAppPerformanceTabList = [
prop: 'clientIp',
queryCycleTotalProp: 'clientIps',
dillDownProp: ['common_client_ip'],
queryCondition: ['ip = \'$param\' AND side = \'client\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1030,6 +1115,7 @@ export const networkAppPerformanceTabList = [
prop: 'serverIp',
queryCycleTotalProp: 'serverIps',
dillDownProp: ['common_server_ip'],
queryCondition: ['ip = \'$param\' AND side = \'server\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1038,6 +1124,7 @@ export const networkAppPerformanceTabList = [
prop: 'clientCountryRegion',
queryCycleTotalProp: 'clientCountries',
dillDownProp: ['client_country_region'],
queryCondition: ['country_region = \'$param\' AND side = \'client\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1046,22 +1133,25 @@ export const networkAppPerformanceTabList = [
prop: 'serverCountryRegion',
queryCycleTotalProp: 'serverCountries',
dillDownProp: ['server_country_region'],
queryCondition: ['country_region = \'$param\' AND side = \'server\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
}, {
label: 'network.clientProvinces',
label: 'network.clientRegions',
prop: 'clientSuperAdminArea',
queryCycleTotalProp: 'clientProvinces',
dillDownProp: ['client_super_admin_area'],
queryCondition: ['super_admin_area = \'$param\' AND side = \'client\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
}, {
label: 'network.serverProvinces',
label: 'network.serverRegions',
prop: 'serverSuperAdminArea',
queryCycleTotalProp: 'serverProvinces',
dillDownProp: ['server_super_admin_area'],
queryCondition: ['super_admin_area = \'$param\' AND side = \'server\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1070,6 +1160,7 @@ export const networkAppPerformanceTabList = [
prop: 'clientAdminArea',
queryCycleTotalProp: 'clientCities',
dillDownProp: ['client_admin_area'],
queryCondition: ['admin_area = \'$param\' AND side = \'client\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1078,6 +1169,7 @@ export const networkAppPerformanceTabList = [
prop: 'serverAdminArea',
queryCycleTotalProp: 'serverCities',
dillDownProp: ['server_admin_area'],
queryCondition: ['admin_area = \'$param\' AND side = \'server\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1086,6 +1178,7 @@ export const networkAppPerformanceTabList = [
prop: 'clientIsp',
queryCycleTotalProp: 'clientIsps',
dillDownProp: ['client_isp'],
queryCondition: ['isp = \'$param\' AND side = \'client\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1094,6 +1187,7 @@ export const networkAppPerformanceTabList = [
prop: 'serverIsp',
queryCycleTotalProp: 'serverIsps',
dillDownProp: ['server_isp'],
queryCondition: ['isp = \'$param\' AND side = \'server\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1102,6 +1196,7 @@ export const networkAppPerformanceTabList = [
prop: 'clientAsn',
queryCycleTotalProp: 'clientAsns',
dillDownProp: ['client_asn'],
queryCondition: ['asn = \'$param\' AND side = \'client\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1110,6 +1205,7 @@ export const networkAppPerformanceTabList = [
prop: 'serverAsn',
queryCycleTotalProp: 'serverAsns',
dillDownProp: ['server_asn'],
queryCondition: ['asn = \'$param\' AND side = \'server\''],
checked: false,
disabled: false,
panelId: drillDownPanelTypeMapping.npmOverviewCommon
@@ -1269,7 +1365,7 @@ export const linkMonitorTabList = [
disabled: false,
panelId: drillDownPanelTypeMapping.linkMonitor
}, {
label: 'network.clientProvinces',
label: 'network.clientRegions',
prop: 'clientSuperAdminArea',
queryCycleTotalProp: 'clientProvinces',
dillDownProp: ['client_super_admin_area'],
@@ -1277,7 +1373,7 @@ export const linkMonitorTabList = [
disabled: false,
panelId: drillDownPanelTypeMapping.linkMonitor
}, {
label: 'network.serverProvinces',
label: 'network.serverRegions',
prop: 'serverSuperAdminArea',
queryCycleTotalProp: 'serverProvinces',
dillDownProp: ['server_super_admin_area'],

3
src/utils/tools.js
View File

@@ -980,6 +980,9 @@ export function combineTabList (tableType, list, commonTabList) {
const tabInCode = listInCode ? listInCode.find(item => item.label === tab.label) : {}
tab.queryCycleTotalProp = tabInCode ? tabInCode.queryCycleTotalProp : null
tab.dillDownProp = tabInCode ? tabInCode.dillDownProp : []
tab.thirdDimensionQueryCondition = tabInCode ? tabInCode.thirdDimensionQueryCondition : []
tab.lineQueryCondition = tabInCode ? tabInCode.lineQueryCondition : []
tab.lineThirdDimensionQueryCondition = tabInCode ? tabInCode.lineThirdDimensionQueryCondition : []
})
}
/*

9
src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue
View File

@@ -339,6 +339,15 @@ export default {
})
this.urlChangeParams[this.curTabState.queryCondition] = queryCondition.join(' OR ')
const curTab = tabGroup[0]
if (curTab.lineQueryCondition) {
const lineQueryCondition = []
curTab.lineQueryCondition.forEach(item => {
lineQueryCondition.push(item.replaceAll('$param', value))
})
this.urlChangeParams[this.curTabState.lineQueryCondition] = lineQueryCondition.join(' OR ')
}
this.$store.getters.menuList.forEach(menu => {
if (this.$_.isEmpty(menu.children) && menu.route) {
if (this.$route.path === menu.route) {

15
src/views/charts2/charts/networkOverview/NetworkOverviewLine.vue
View File

@@ -89,13 +89,15 @@ export default {
const { query } = useRoute()
const lineRefer = ref(query.lineRefer || 'Average')
const lineTab = ref(query.lineTab || '')
const queryCondition = ref(query.queryCondition || '')
const lineQueryCondition = ref(query.lineQueryCondition || '')
const lineThirdDimensionQueryCondition = ref(query.lineThirdDimensionQueryCondition || '')
const tabOperationType = ref(query.tabOperationType)
const networkOverviewBeforeTab = ref(query.networkOverviewBeforeTab)
return {
lineRefer,
lineTab,
queryCondition,
lineQueryCondition,
lineThirdDimensionQueryCondition,
tabOperationType,
networkOverviewBeforeTab,
myChart: shallowRef(null)
@@ -167,8 +169,13 @@ export default {
}
let url
if (this.queryCondition) {
params.q = this.queryCondition
if (this.lineQueryCondition) {
params.q = this.lineQueryCondition
const { query } = this.$route
params.type = query.dimensionType
url = api.netWorkOverview.drilldownTrafficAnalysis
} if (this.lineThirdDimensionQueryCondition) {
params.q = this.lineThirdDimensionQueryCondition
const { query } = this.$route
params.type = query.dimensionType
url = api.netWorkOverview.drilldownTrafficAnalysis

33
src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
View File

@@ -1383,6 +1383,7 @@ export default {
}
conditions = queryCondition.join(' AND ')
this.urlChangeParams[this.curTabState.queryCondition] = conditions
this.urlChangeParams[this.curTabState.lineQueryCondition] = conditions
} else {
if (tab.queryCondition) {
tab.queryCondition.forEach(item => {
@@ -1397,6 +1398,13 @@ export default {
}
conditions = queryCondition.join(' OR ')
this.urlChangeParams[this.curTabState.queryCondition] = conditions
if (tab.lineQueryCondition) {
const lineQueryCondition = []
tab.lineQueryCondition.forEach(item => {
lineQueryCondition.push(item.replaceAll('$param', value))
})
this.urlChangeParams[this.curTabState.lineQueryCondition] = lineQueryCondition.join(' OR ')
}
}
},
getFirstCheckedTab () {
@@ -1555,6 +1563,7 @@ export default {
queryCondition.push('common_server_port=' + valueGroup[1])
}
this.urlChangeParams[this.curTabState.queryCondition] = queryCondition.join(' AND ')
this.urlChangeParams[this.curTabState.lineQueryCondition] = queryCondition.join(' AND ')
} else {
if (curTab.queryCondition) {
curTab.queryCondition.forEach(item => {
@@ -1567,9 +1576,15 @@ export default {
})
}
}
this.urlChangeParams[this.curTabState.queryCondition] = queryCondition.join(' OR ')
}
const lineQueryCondition = []
if (curTab.lineQueryCondition) {
curTab.lineQueryCondition.forEach(item => {
lineQueryCondition.push(item.replaceAll('$param', value))
})
this.urlChangeParams[this.curTabState.lineQueryCondition] = lineQueryCondition.join(' OR ')
}
},
async metricChange () {
// 需要将列设置到当前tab的"hiddenColumns": [],"disabledColumns": [],
@@ -1800,7 +1815,6 @@ export default {
}
},
getQueryCondition () {
const queryCondition = this.getUrlParam('queryCondition')
const fourthPanel = this.getUrlParam('fourthPanel', -1, true)
const dimensionType = this.getUrlParam('dimensionType', '')
const fourthMenu = this.getUrlParam('fourthMenu', '')
@@ -1815,8 +1829,15 @@ export default {
}
}
}
const queryCondition = this.getUrlParam('queryCondition')
const thirdDimensionQueryCondition = this.getUrlParam('thirdDimensionQueryCondition')
if (queryCondition) {
return queryCondition
} else if (thirdDimensionQueryCondition) {
return thirdDimensionQueryCondition
} else {
return null
}
},
getUrlParam (param, defaultValue, isNumber) {
if (isNumber) {
@@ -1880,6 +1901,9 @@ export default {
tab.queryCycleTotalProp = tabInCode ? tabInCode.queryCycleTotalProp : null
tab.dillDownProp = tabInCode ? tabInCode.dillDownProp : []
tab.queryCondition = tabInCode ? tabInCode.queryCondition : []
tab.thirdDimensionQueryCondition = tabInCode ? tabInCode.thirdDimensionQueryCondition : []
tab.lineQueryCondition = tabInCode ? tabInCode.lineQueryCondition : []
tab.lineThirdDimensionQueryCondition = tabInCode ? tabInCode.lineThirdDimensionQueryCondition : []
})
// 设置drilldownTabs：未下钻状态设置，已下钻状态无需设置
// let thirdMenu = this.getUrlParam(this.curTabState.thirdMenu, '')
@@ -1909,6 +1933,9 @@ export default {
drilldownTabWithAllInfo.queryCycleTotalProp = tabInCode ? tabInCode.queryCycleTotalProp : null
drilldownTabWithAllInfo.dillDownProp = tabInCode ? tabInCode.dillDownProp : []
drilldownTabWithAllInfo.queryCondition = tabInCode ? tabInCode.queryCondition : []
drilldownTabWithAllInfo.thirdDimensionQueryCondition = tabInCode ? tabInCode.thirdDimensionQueryCondition : []
drilldownTabWithAllInfo.lineQueryCondition = tabInCode ? tabInCode.lineQueryCondition : []
drilldownTabWithAllInfo.lineThirdDimensionQueryCondition = tabInCode ? tabInCode.lineThirdDimensionQueryCondition : []
drilldownTabFull.push(drilldownTabWithAllInfo)
}
}