diff --git a/src/assets/css/components/components/advancedSearch/advanced-search2.scss b/src/assets/css/components/components/advancedSearch/advanced-search2.scss index 4c14cedb..9806d054 100644 --- a/src/assets/css/components/components/advancedSearch/advanced-search2.scss +++ b/src/assets/css/components/components/advancedSearch/advanced-search2.scss @@ -10,10 +10,9 @@ right: 10px; .search__suffix { - margin-left: 8px; // 新版实体列表改版,后续记得解开 + // margin-left: 8px; - .cn-icon-search-advance, .cn-icon-search-normal { - //.cn-icon-search-advance, .cn-icon-search-normal, .cn-icon-filter { + .cn-icon-search-advance, .cn-icon-search-normal, .cn-icon-filter { color: #A6AAAE; font-size: 18px; } diff --git a/src/assets/css/components/views/detections/detection-overview.scss b/src/assets/css/components/views/detections/detection-overview.scss index 20598102..65c57ce5 100644 --- a/src/assets/css/components/views/detections/detection-overview.scss +++ b/src/assets/css/components/views/detections/detection-overview.scss @@ -222,3 +222,10 @@ padding: 0 4px; //color: white; } + +.performance-event-remark { + font-family: NotoSansSChineseRegular; + font-size: 12px; + color: #353636; + font-weight: 400; +} diff --git a/src/assets/css/components/views/entityExplorer/entity-filter.scss b/src/assets/css/components/views/entityExplorer/entity-filter.scss index 0ea0a0de..71fbb493 100644 --- a/src/assets/css/components/views/entityExplorer/entity-filter.scss +++ b/src/assets/css/components/views/entityExplorer/entity-filter.scss @@ -1,104 +1,100 @@ .entity-filter-case { display: flex; flex-direction: column; - width: 280px; - margin-right: 10px; + width: 320px; + margin-right: 20px; overflow: auto; z-index: 1; + border: 1px solid rgba(226, 229, 236, 1) !important; + border-radius: 4px !important; .filter-case__header { - background-color: #E1E6ED; - margin-bottom: 10px; - padding-left: 8px; - height: 36px; - line-height: 36px; - color: #666; - font-size: 14px; - } - .entity-filter { - display: flex; - flex-direction: column; - border: 1px solid #E7EAED; - margin-bottom: 10px; - background-color: white; - - .filter__header { - height: 46px; - margin: 0 15px; - line-height: 46px; - border-bottom: 1px solid #EFF2F5; + padding-left: 8px; + height: 36px; + line-height: 36px; + color: #666; font-size: 14px; - color: #333; + background: #F7F7F7; + box-shadow: 0 1px 0 0 rgba(226,229,236,1); + border-radius: 4px 4px 0 0; } - .filter__body { - padding: 11px 0 21px 0; - .filter__row { - padding: 0 15px; + + .filter__header { + height: 46px; + line-height: 46px; + margin: 0 20px; + font-size: 14px; + color: #353636; + font-weight: 500; + } + + .filter__body { + width: calc(100% - 40px); + margin: 0 20px; + + .filter-hr { + width: calc(100% + 20px); + margin-left: -10px; + margin-top: 10px; + height: 1px; + background: #EFF2F5; + //background: #000; + } + + .filter__body-item { + height: 26px; + line-height: 26px; + display: flex; + align-items: center; + justify-content: space-between; + cursor: pointer; + + .filter__body-item-left { + display: flex; align-items: center; - cursor: pointer; - transition: all linear .2s; - .filter__row-popover { - display: flex; - line-height: 26px; + font-size: 14px; + color: #353636; + font-weight: 400; + + .filter-country-flag { + width: 18px; + height: 12px; } - &:hover, &.filter__row--active { - background-color: #F3F7FA; - } - .row__label { - font-size: 14px; - flex: 8; - display: flex; - i { - color: #8FA1BE; - } - span { - padding-left: 6px; - color: #333; - } - } - .row__value { - color: #666; - position: relative; - display: inline-block; + .filter__body-item-left-index { + width: 16px; + height: 16px; text-align: center; - flex: 1; - .chart__loading img { - left: unset; - right: 0; - } - } - } - } - } -} -.filter__row-popover { - .pop-title { - i { - margin-right: 6px; - } - } - .entity-pop-custom { - .filter-top-box { - .chart__loading { - height: calc(100% - 65px); - top: 64px; - } - .top-table-percent{ - display:grid; - grid-template-columns: 50% auto; - grid-template-rows: 100%; - grid-row-gap: 0px; - grid-column-gap: 0px; - .top-table-progress{ - align-content: center; - padding-top: 8px; - } - } - .customer-no-border-table { - .el-table__body-wrapper { - height: calc(100% - 36px); + background: #EFF2F5; + border-radius: 2px; + margin-right: 6px; + font-family: NotoSansHans-Black; + font-size: 9px; + color: #96A2B0; + font-weight: 900; + display: flex; + align-items: center; + justify-content: center; } + + .filter__body-item-left-label { + max-width: 180px; + font-family: NotoSansSChineseRegular; + font-size: 14px; + color: #353636; + font-weight: 400; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + } + + .filter__body-item-right { + flex-shrink: 0; + font-family: NotoSansSChineseRegular; + font-size: 12px; + color: #717171; + font-weight: 400; } } } diff --git a/src/assets/css/components/views/entityExplorer/entityList/card.scss b/src/assets/css/components/views/entityExplorer/entityList/card.scss index 208afef8..6cc68dad 100644 --- a/src/assets/css/components/views/entityExplorer/entityList/card.scss +++ b/src/assets/css/components/views/entityExplorer/entityList/card.scss @@ -5,7 +5,7 @@ background: #FFFFFF; border-radius: 2px; transition: all .2s; - //border: 1px solid #E2E5EC; 新版实体列表改版,后续记得解开 + border: 1px solid #E2E5EC; &:hover .cn-entity__header .header__content { diff --git a/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss b/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss index 40ab4f7f..b3e683ae 100644 --- a/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss +++ b/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss @@ -160,6 +160,10 @@ &:last-of-type { padding-bottom: 0; } + + .el-popper { + min-width: 90px !important; + } } .row__content-accept { margin-left: 39px; @@ -187,6 +191,12 @@ color: #666666; } } + + .overview__row-related { + display: flex; + align-items: center; + margin-bottom: 8px; + } } .overview__content.domain__content { @@ -306,3 +316,8 @@ .margin-l-140 { margin-left: 140px; } + +.line-center { + display: flex; + align-items: center; +} diff --git a/src/assets/css/components/views/entityExplorer/entityList/entity-list.scss b/src/assets/css/components/views/entityExplorer/entityList/entity-list.scss index ed20c962..8542d855 100644 --- a/src/assets/css/components/views/entityExplorer/entityList/entity-list.scss +++ b/src/assets/css/components/views/entityExplorer/entityList/entity-list.scss @@ -1,5 +1,5 @@ .entity-list { - width: calc(100% - 290px); + width: 100%; height: calc(100% - 42px); flex: 1; position: relative; diff --git a/src/assets/css/components/views/entityExplorer/entityList/row.scss b/src/assets/css/components/views/entityExplorer/entityList/row.scss index ac1ad015..5d47ae0b 100644 --- a/src/assets/css/components/views/entityExplorer/entityList/row.scss +++ b/src/assets/css/components/views/entityExplorer/entityList/row.scss @@ -1,9 +1,8 @@ .cn-entity--list { display: flex; - //border: 1px #E2E5EC solid; - //margin-bottom: 10px; - //border-radius: 4px; - // 新版实体列表改版,后续记得解开 + border: 1px #E2E5EC solid; + margin-bottom: 10px; + border-radius: 4px; .cn-entity__collapse { margin-bottom: 1px; @@ -13,8 +12,8 @@ justify-content: center; align-items: flex-start; background-color: #F3F7FA; - //border-radius: 4px 0 0 4px; - // 新版实体列表改版,后续记得解开 + border-radius: 4px 0 0 4px; + span { transform: rotate(0); transition: all linear .2s; @@ -41,12 +40,12 @@ overflow: hidden; display: flex; flex-wrap: wrap; - //align-content: center; + align-content: center; padding: 16px 0; margin-bottom: 1px; background-color: white; - //border-radius: 0 4px 4px 0; - // 新版实体列表改版,后续记得解开 + border-radius: 0 4px 4px 0; + .cn-entity__icon { margin-left: 26px; margin-right: 10px; @@ -77,13 +76,12 @@ font-size: 16px; padding-bottom: 3px; color: #333333; - //.cn-entity__header-title { - // margin-right: 10px; - //} - //.cn-entity__header-tag { - // - //} - // 新版实体列表改版,后续记得解开 + .cn-entity__header-title { + margin-right: 10px; + } + .cn-entity__header-tag { + + } } .cn-entity__body { @@ -161,27 +159,21 @@ color: #666; } } - } - //.show-detail { - // flex-shrink: 0; - // padding: 0 30px; - // font-size: 12px; - // color: #3976CB; - // //color: #2C72C6; - // //font-weight: 400; - // //margin-top: -17px; - // // 新版实体列表改版,后续记得解开 - // - // &:hover { - // cursor: pointer; - // } - // - // //i { - // // font-size: 12px; - // // margin-right: 5px; - // //} - //} + .row-item-label { + font-family: NotoSansSChineseRegular; + font-size: 14px; + color: #717171; + font-weight: 400; + } + + .row-item-value { + font-family: NotoSansSChineseRegular; + font-size: 14px; + color: #353636; + font-weight: 400; + } + } } } } diff --git a/src/components/advancedSearch/TagMode.vue b/src/components/advancedSearch/TagMode.vue index 94e15c1e..3d86791e 100644 --- a/src/components/advancedSearch/TagMode.vue +++ b/src/components/advancedSearch/TagMode.vue @@ -75,13 +75,10 @@
{{$t('entities.advancedSearch.add')}}
-
- - +
-
- +
@@ -440,20 +437,19 @@ export default { } - - - - - - - - - - +--> + .el-icon-search { + color: #fff !important; + margin-top: 9px !important; + } +} + diff --git a/src/components/advancedSearch/TextMode.vue b/src/components/advancedSearch/TextMode.vue index f7fa06d5..9b93108f 100644 --- a/src/components/advancedSearch/TextMode.vue +++ b/src/components/advancedSearch/TextMode.vue @@ -4,13 +4,12 @@ >
- +
- - - - -
+
+ +
+
@@ -43,9 +42,9 @@ export default { }, emits: ['changeMode', 'search'], methods: { - // cleanParams () { - // toRaw(this.codeMirror).setValue('') - // }, + cleanParams () { + toRaw(this.codeMirror).setValue('') + }, initCodeMirror () { this.codeMirror = CodeMirror.fromTextArea(this.$refs.textSearch, { mode: { @@ -189,28 +188,28 @@ export default { } - - - - - - - - - +--> + .el-icon-search { + color: #fff !important; + margin-top: 9px !important; + } +} + diff --git a/src/components/layout/Container.vue b/src/components/layout/Container.vue index 14418710..d7ce7545 100644 --- a/src/components/layout/Container.vue +++ b/src/components/layout/Container.vue @@ -20,10 +20,7 @@ export default { entityDetectionStyle () { const route = this.$route.name !== undefined ? this.$route.name : this.$route if (listScrollPath.indexOf(route.path) > -1) { - // 新版实体列表改版,后续记得解开 - const style = route.path === listScrollPath[0] ? 'overflow:auto;background-color: #EFF2F5;' : 'overflow:auto;' - // const style = 'overflow:auto;' - return style + return 'overflow:auto;' } else { return '' } diff --git a/src/mixins/relatedServer.js b/src/mixins/relatedServer.js index 52c618fd..e693a04a 100644 --- a/src/mixins/relatedServer.js +++ b/src/mixins/relatedServer.js @@ -19,7 +19,12 @@ export default { this.loadingRelationshipOne = true get(relationshipUrlOne, this.getQueryParams()).then(response => { if (response.code === 200) { - const relationshipDataOne = response.data.result + const relationshipDataOne = [] + if (response.data.result.length > 0) { + response.data.result.forEach(item => { + relationshipDataOne.push({ value: item, show: true }) + }) + } // 将请求数据 传入方法中 this.relatedServerWidth(relationshipDataOne, refOne, 1) } @@ -30,7 +35,12 @@ export default { this.loadingRelationshipTwo = true get(relationshipUrlTow, this.getQueryParams()).then(response => { if (response.code === 200) { - const relationshipDataTwo = response.data.result + const relationshipDataTwo = [] + if (response.data.result.length > 0) { + response.data.result.forEach(item => { + relationshipDataTwo.push({ value: item, show: true }) + }) + } // 将请求数据 传入方法中 this.relatedServerWidth(relationshipDataTwo, refTow, 2) } @@ -45,7 +55,7 @@ export default { let flag = true data.forEach((item) => { // 每条数据的宽度 - const width = getTextRect(item.appName || item.domain || item.ip).width + 67 + const width = getTextRect(item.value).width + 67 if (width > 67 && width !== 0) { sum += width if (flag && sum >= relatedServerWidth && num === 1) { diff --git a/src/mock/entity.js b/src/mock/entity.js index 4a9ad027..27486afa 100644 --- a/src/mock/entity.js +++ b/src/mock/entity.js @@ -451,6 +451,300 @@ if (openMock) { } } }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/query/list.*`), 'get', function (requestObj) { + const result = { + pageNo: 1, + pageSize: 10, + total: 3, + list: [ + { entityValue: '192.168.12.34', entityType: 'ip' }, + { entityValue: 'gdbzkz.com', entityType: 'domain' }, + { entityValue: 'qqvideo', entityType: 'app' } + ] + } + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/detail/basic.*`), 'get', function (requestObj) { + const entityType = getEntityType(requestObj.url) + let result = {} + switch (entityType) { + case ('domain'): { + result = { + whois: { + registrarName: 'Beijing Baidu Company', + registrantOrg: 'Beijing Baidu Netcom Science Technology Co., Ltd.', + registrantCountry: 'China', + email: '信息已设置隐私保护', + createDate: 1685329698, + expireDate: 1685329698 + }, + icp: { + icpSiteLicense: '京ICP证030173号', + icpCompanyName: '北京百度网讯科技有限公司', + icpCompanyType: '企业' + }, + category: { + name: '门户网站', + group: '互联网', + reputationLevel: 'Trustworthy' + } + } + break + } + case ('ip'): { + result = { + asn: { id: 2, asn: '14061', organization: 'DIGITALOCEAN-ASN - DigitalOcean, LLC, US' }, + location: { + continent: 'North America', + country: 'United States', + province: 'New York', + city: '', + lngwgs: '-74.006', + latwgs: '40.713', + isp: 'dba Omsoft', + owner: 'tie net' + } + } + break + } + case ('app'): { + result = { + category: { + appName: 'QQ', + appId: 333, + appCategory: '娱乐', + appSubcategory: '聊天', + appRisk: '1', + appDescription: '聊天社交软件', + appLongname: 'Tencent qq', + appTechnology: 'socket', + appCompany: 'tencent', + appCompanyCategory: '互联网' + } + } + break + } + } + + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/detail/kb/intelligence/tag.*`), 'get', function (requestObj) { + const entityType = getEntityType(requestObj.url) + let result = {} + switch (entityType) { + case ('domain'): { + result = { + malware: { + threatType: 'command and control', + malwareName: '情报攻击', + malwareAlias: '攻击' + }, + darkweb: { + nodeType: 'mtproxy' + }, + userDefinedTags: [ + { + id: 1, + tagValue: '门户网站' + } + ] + } + break + } + case ('ip'): { + result = { + malware: { + threatType: 'command and control', + malwareName: 'IcedID', + malwareAlias: 'BokBot,IceID' + }, + darkweb: { + nodeType: '12p' + }, + psiphon3Ip: { + type: 'high', + method: 'passive_ml', + confidence: 88, + confidenceLevel: 'confirmed' + }, + userDefinedTags: [ + { + id: 1, + tagValue: '门户网站' + } + ] + } + break + } + case ('app'): { + result = { + userDefinedTags: [ + { + id: 1, + tagValue: '门户网站' + }, + { + id: 2, + tagValue: '新闻软件' + } + ] + } + break + } + } + + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/detail/domain/relate.*`), 'get', function (requestObj) { + const relateType = getRelateType(requestObj.url) + let result = {} + switch (relateType) { + case ('ip'): { + result = { + total: 5, + result: ['bittorrent', 'qq_web', 'wechat', 'tencent', 'outlook'] + } + break + } + case ('app'): { + result = { + total: 5, + result: ['192.107.175.180', '192.107.175.180', '192.107.175.180', '192.107.175.180', '192.107.175.180'] + } + break + } + } + + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/detail/ip/relate.*`), 'get', function (requestObj) { + const relateType = getRelateType(requestObj.url) + let result = {} + switch (relateType) { + case ('domain'): { + result = { + total: 5, + result: ['bittorrent', 'qq_web', 'wechat', 'tencent', 'outlook'] + } + break + } + case ('app'): { + result = { + total: 5, + result: ['gdbzkz.com', 'gdbzkz.com', 'gdbzkz.com', 'gdbzkz.com', 'gdbzkz.com'] + } + break + } + } + + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/detail/app/relate.*`), 'get', function (requestObj) { + const relateType = getRelateType(requestObj.url) + let result = {} + switch (relateType) { + case ('ip'): { + result = { + total: 5, + result: ['gdbzkz.com', 'gdbzkz.com', 'gdbzkz.com', 'gdbzkz.com', 'gdbzkz.com'] + } + break + } + case ('domain'): { + result = { + total: 5, + result: ['192.107.175.180', '192.107.175.180', '192.107.175.180', '192.107.175.180', '192.107.175.180'] + } + break + } + } + + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/detail/traffic/performance.*`), 'get', function (requestObj) { + const result = { + resultType: 'object', + result: { + httpResponseLatencyValue: null, + httpResponseLatencyP50: null, + httpResponseLatencyP90: null, + httpResponseLatencyP99: null, + sslConLatencyValue: 191, + sslConLatencyP50: 137, + sslConLatencyP90: 311, + sslConLatencyP99: 1610, + establishLatencyValue: 42, + establishLatencyP50: 33, + establishLatencyP90: 54, + establishLatencyP99: 177, + sequenceGapLossPercentValue: 0.001, + sequenceGapLossPercentP50: 0, + sequenceGapLossPercentP90: 0.0038, + sequenceGapLossPercentP99: 0.0087, + pktRetransPercentValue: 0.0124, + pktRetransPercentP50: 0.0096, + pktRetransPercentP90: 0.0183, + pktRetransPercentP99: 0.0769 + } + } + + return { + msg: 'success', + code: 200, + data: result + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/overview/active.*`), 'get', function (requestObj) { + const data = { domainCount: 755, ipCount: 8373, appCount: 263 } + + return { + msg: 'success', + code: 200, + data: data + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/overview/new.*`), 'get', function (requestObj) { + const data = { domainCount: 262, ipCount: 4201, appCount: 43 } + + return { + msg: 'success', + code: 200, + data: data + } + }) + Mock.mock(new RegExp(`${urlAndVersion}/entity/explorer/overview/total.*`), 'get', function (requestObj) { + const data = { domainCount: 7686274, ipCount: 2169957, appCount: 856 } + + return { + msg: 'success', + code: 200, + data: data + } + }) } const getQuery = (url) => { @@ -467,3 +761,31 @@ const getQuery = (url) => { } return result } + +const getEntityType = (url) => { + let entityType = '' + if (url.indexOf('/domain?') > -1) { + entityType = 'domain' + } + if (url.indexOf('/ip?') > -1) { + entityType = 'ip' + } + if (url.indexOf('/app?') > -1) { + entityType = 'app' + } + return entityType +} + +const getRelateType = (url) => { + let entityType = '' + if (url.indexOf('/domains?') > -1) { + entityType = 'domain' + } + if (url.indexOf('/ips?') > -1) { + entityType = 'ip' + } + if (url.indexOf('/apps?') > -1) { + entityType = 'app' + } + return entityType +} diff --git a/src/utils/api.js b/src/utils/api.js index fe383ce7..3fa6108f 100644 --- a/src/utils/api.js +++ b/src/utils/api.js @@ -262,7 +262,47 @@ export const api = { ipRelatedDomain: apiVersion + '/entity/graph/relation/ip/relate/domains', ipRelatedApp: apiVersion + '/entity/graph/relation/ip/relate/apps', appRelatedIp: apiVersion + '/entity/graph/relation/app/relate/ips', - appRelatedDomain: apiVersion + '/entity/graph/relation/app/relate/domains' + appRelatedDomain: apiVersion + '/entity/graph/relation/app/relate/domains', + basicInfo: apiVersion + '/entity/graph/relation/basic', + tags: apiVersion + '/entity/graph/relation/kb/intelligence/tag' + }, + entityList: { + list: apiVersion + '/entity/explorer/query/list', // 实体列表 + domainBasicInfo: apiVersion + '/entity/explorer/detail/basic/domain', // Domain实体响应结果 + ipBasicInfo: apiVersion + '/entity/explorer/detail/basic/ip', // ip实体响应 + appBasicInfo: apiVersion + '/entity/explorer/detail/basic/app', // app实体响应 + domainTags: apiVersion + '/entity/explorer/detail/kb/intelligence/tag/domain', // Domain实体标签响应结果 + ipTags: apiVersion + '/entity/explorer/detail/kb/intelligence/tag/ip', // ip实体标签响应结果 + appTags: apiVersion + '/entity/explorer/detail/kb/intelligence/tag/app', // app实体标签响应结果 + domainThroughput: apiVersion + '/entity/explorer/detail/traffic/throughput/domain', // 实体流量信息 + ipThroughput: apiVersion + '/entity/explorer/detail/traffic/throughput/ip', // 实体流量信息 + appThroughput: apiVersion + '/entity/explorer/detail/traffic/throughput/app', // 实体流量信息 + domainPerformance: apiVersion + '/entity/explorer/detail/traffic/performance/domain', // domain网络质量 + ipPerformance: apiVersion + '/entity/explorer/detail/traffic/performance/ip', // ip网络质量 + appPerformance: apiVersion + '/entity/explorer/detail/traffic/performance/app', // app网络质量 + domainRelatedApp: apiVersion + '/entity/explorer/detail/domain/relate/apps', // 域名相关app + domainRelatedIp: apiVersion + '/entity/explorer/detail/domain/relate/ips', // 域名相关ip + appRelatedDomain: apiVersion + '/entity/explorer/detail/app/relate/domains', // app相关域名 + appRelatedIp: apiVersion + '/entity/explorer/detail/app/relate/ips', // app相关ip + ipRelatedApp: apiVersion + '/entity/explorer/detail/ip/relate/apps', // ip相关app + ipRelatedDomain: apiVersion + '/entity/explorer/detail/ip/relate/domains', // ip相关域名 + ipRelatedPort: apiVersion + '/entity/explorer/detail/ip/relate/ports', // ip开放端口 + domainTrafficMap: apiVersion + '/entity/explorer/detail/traffic/map/domain', // domain流量地图 + ipTrafficMap: apiVersion + '/entity/explorer/detail/traffic/map/ip', // ip流量地图 + appTrafficMap: apiVersion + '/entity/explorer/detail/traffic/map/app', // app流量地图 + summaryCount: apiVersion + '/entity/explorer/query/summaryCount', // 实体基数统计 + aggCountry: apiVersion + '/entity/explorer/top/aggCountry', // 国家实体基数统计 + aggAsn: apiVersion + '/entity/explorer/top/aggAsn', // ASN实体基数统计 + aggCity: apiVersion + '/entity/explorer/top/aggCity', // 城市实体基数统计 + domainSecurity: apiVersion + '/entity/explorer/detail/event/security/domain', // domain安全事件详情 + ipSecurity: apiVersion + '/entity/explorer/detail/event/security/domain', // ip安全事件详情 + appSecurity: apiVersion + '/entity/explorer/detail/event/security/domain', // app安全事件详情 + domainEventPerformance: apiVersion + '/entity/explorer/detail/event/performance/domain', // domain服务质量详情 + ipEventPerformance: apiVersion + '/entity/explorer/detail/event/performance/ip', // ip服务质量详情 + appEventPerformance: apiVersion + '/entity/explorer/detail/event/performance/app', // app服务质量详情 + entityActive: apiVersion + '/entity/explorer/overview/active', // entity首页active数据概览 + entityNew: apiVersion + '/entity/explorer/overview/new', // entity首页new数据概览 + entityTotal: apiVersion + '/entity/explorer/overview/total' // entity首页total数据概览 } } } diff --git a/src/utils/static-data.js b/src/utils/static-data.js index a390ecc2..5999d87c 100644 --- a/src/utils/static-data.js +++ b/src/utils/static-data.js @@ -282,7 +282,7 @@ export const columnList = [ label: 'IP.Address' }, { - name: 'ip_location_country', + name: 'country', type: 'string', label: 'IP.Country' }, @@ -292,12 +292,12 @@ export const columnList = [ label: 'IP.Province' }, { - name: 'ip_location_city', + name: 'region', type: 'string', label: 'IP.City' }, { - name: 'ip_asn', + name: 'asn', type: 'string', label: 'IP.ASN' }, @@ -367,7 +367,7 @@ export const columnList = [ label: 'Domain.Whois address' }, { - name: 'domain_whois_city', + name: 'region', type: 'string', label: 'Domain.Whois city' }, @@ -377,7 +377,7 @@ export const columnList = [ label: 'Domain.Whois state' }, { - name: 'domain_whois_country', + name: 'country', type: 'string', label: 'Domain.Whois country' }, diff --git a/src/views/entityExplorer/EntityExplorer.vue b/src/views/entityExplorer/EntityExplorer.vue index 4fe7d153..d7c3f726 100644 --- a/src/views/entityExplorer/EntityExplorer.vue +++ b/src/views/entityExplorer/EntityExplorer.vue @@ -3,60 +3,60 @@ class="entity-explorer" :class="{'entity-explorer--show-list': showList}"> - - - - - - - - - - - -
- - - - - - +
+
+
{{$t('network.entity')}}
- +
- - - - - -
-
- - +
+ +
+ + +
+
+ + {{ summaryCount.total }}results,IP + {{ summaryCount.ipCount }},Domain + {{ summaryCount.fqdnCount }},APP + {{ summaryCount.appCount }} +
+ + +
-
+ +
@@ -150,8 +150,6 @@ + + diff --git a/src/views/entityExplorer/entityList/Row.vue b/src/views/entityExplorer/entityList/Row.vue index 140edaec..bacf6d49 100644 --- a/src/views/entityExplorer/entityList/Row.vue +++ b/src/views/entityExplorer/entityList/Row.vue @@ -9,75 +9,76 @@
-
- {{ entityData.ipAddr || entityData.domainName || entityData.appName || 'Unknown' }} - - - - - - + +
+ {{ entityData.entityValue || 'Unknown' }} + + + {{ item.value }} + +
+
- {{ $t('entities.sentThroughput') }} :   - + {{ $t('entities.sentThroughput') }} :   + {{ entityData.bytesSentRate ? unitConvert(entityData.bytesSentRate, unitTypes.byte).join(' ') + 'ps' : '-' }} @@ -107,8 +108,8 @@
- {{ $t('entities.receivedThroughput') }} :   - + {{ $t('entities.receivedThroughput') }} :   + {{ entityData.bytesReceivedRate ? unitConvert(entityData.bytesReceivedRate, unitTypes.byte).join(' ') + 'ps' : '-' }} @@ -133,23 +134,7 @@
- -
- - {{ $t('entities.recentAlert') }} :   - {{ entityData.performanceCount }} -
-
- - {{ $t('entities.recentSecurity') }} :   - {{ entityData.securityCount }} -
-
- - - -
@@ -172,6 +157,10 @@ import DetailOverview from '@/views/entityExplorer/entityList/detailOverview/Det import entityListMixin from './entityListMixin' import relatedServer from '@/mixins/relatedServer' import Loading from '@/components/common/Loading' +import axios from 'axios' +import { api } from '@/utils/api' +import { entityDetailTags, psiphon3IpType } from '@/utils/constants' +import _ from 'lodash' export default { name: 'Row', @@ -188,35 +177,109 @@ export default { data () { return { loading: false, - isCollapse: true // 是否是折叠状态 + isCollapse: true, // 是否是折叠状态 + levelTwoTags: [] } }, computed: { ipLocationRegion () { return function (entityData) { const hasProvinceAndCity = - entityData.ipLocationProvince && - entityData.ipLocationCity && - entityData.ipLocationProvince !== 'null' && - entityData.ipLocationCity !== 'null' + entityData.province && + entityData.city && + entityData.province !== 'null' && + entityData.city !== 'null' const hasProvince = - entityData.ipLocationProvince && - entityData.ipLocationProvince !== 'null' + entityData.province && + entityData.province !== 'null' const hasCity = - entityData.ipLocationCity && entityData.ipLocationCity !== 'null' + entityData.city && entityData.city !== 'null' if (hasProvinceAndCity) { - return `${entityData.ipLocationProvince}, ${entityData.ipLocationCity}` + return `${entityData.province}, ${entityData.city}` } else if (hasProvince) { - return entityData.ipLocationProvince + return entityData.province } else if (hasCity) { - return entityData.ipLocationCity + return entityData.city } else { return '-' } } } }, + mounted () { + this.initData() + this.initTagsData() + }, methods: { + initData () { + let url = '' + switch (this.entity.entityType) { + case ('domain'): { + url = api.entity.entityList.domainBasicInfo + break + } + case ('ip'): { + url = api.entity.entityList.ipBasicInfo + break + } + case ('app'): { + url = api.entity.entityList.appBasicInfo + break + } + } + axios.get(`${url}?resource=${this.entity.entityValue}`).then(response => { + this.$nextTick(() => { + this.entityData = { ...response.data.data, ...this.entity } + }) + }) + }, + initTagsData () { + let url = '' + switch (this.entity.entityType) { + case ('domain'): { + url = api.entity.entityList.domainTags + break + } + case ('ip'): { + url = api.entity.entityList.ipTags + break + } + case ('app'): { + url = api.entity.entityList.appTags + break + } + } + axios.get(`${url}?resource=${this.entity.entityValue}`).then(responese => { + const res = responese.data + if (res.code === 200) { + Object.keys(res.data).forEach(k => { + if (k !== 'userDefinedTags' && res.data[k]) { + Object.keys(res.data[k]).forEach(k2 => { + const find = entityDetailTags[this.entity.entityType].find(t => t.name === k2) + if (find) { + this.levelTwoTags.push({ key: k2, value: this.tagValueHandler(k, k2, res.data[k][k2]), type: find.type }) + } + }) + } + }) + if (_.isArray(res.data.userDefinedTags)) { + this.levelTwoTags = _.concat(this.levelTwoTags, res.data.userDefinedTags.map(tag => ({ value: tag.tagValue, type: 'normal' }))) + } + this.hideTagArea = _.isEmpty(this.levelTwoTags) + } + }) + }, + tagValueHandler (k, k2, value) { + if (k === 'psiphon3Ip') { + if (k2 === 'type') { + const find = psiphon3IpType.find(t => t.value === value) + if (find) { + return find.name + } + } + } + return value + }, /* 切换折叠状态 */ switchCollapse () { this.isCollapse = !this.isCollapse diff --git a/src/views/entityExplorer/entityList/detailOverview/App.vue b/src/views/entityExplorer/entityList/detailOverview/App.vue index 62d63a74..fa2d4d54 100644 --- a/src/views/entityExplorer/entityList/detailOverview/App.vue +++ b/src/views/entityExplorer/entityList/detailOverview/App.vue @@ -4,23 +4,23 @@
APP ID
-
{{entity.appId|| '-'}}
+
{{entity.category.appId || '-'}}
{{$t('entities.category')}}
-
{{entity.appCategory|| '-'}}
+
{{entity.category.appCategory || '-'}}
{{$t('entities.subcategory')}}
-
{{entity.appSubcategory || '-'}}
+
{{entity.category.appSubcategory || '-'}}
{{$t('entities.riskLevel')}}
-
{{appRisk(entity.appRisk) || '-'}}
+
{{appRisk(parseInt(entity.category.appRisk)) || '-'}}
{{$t('overall.remark')}}
-
{{entity.appDescription || '-'}}
+
{{entity.category.appDescription || '-'}}
@@ -43,103 +43,78 @@
{{$t('overall.sent')}}:{{unitConvert(entityData.bytesSentRate, unitTypes.byte).join(' ')}}ps
-
+
-
+
{{$t('overall.received')}}:{{unitConvert(entityData.bytesReceivedRate, unitTypes.byte).join(' ')}}ps
-
+
+ +
+
{{$t('entities.networkQualityRating')}}
+ +
+
+
+
+ Score:{{score}} +
+
+
{{$t('overall.relationship')}}
-
-
- -
-
- {{relationshipDataOne.length}} - {{$t('entities.relatedDomains')}} -
-
- {{item.domain}} -
+
+
+
{{$t('entities.tab.relatedIp')}}
+ + +