From c86a7cfeaed0b2be0443f3c45be07c5be3fddbb4 Mon Sep 17 00:00:00 2001
From: chenjinsong <523037378@qq.com>
Date: Fri, 16 Jun 2023 17:18:58 +0800
Subject: [PATCH] =?UTF-8?q?CN-1087=20fix:=20=E5=AE=9E=E4=BD=93=E5=85=B3?=
 =?UTF-8?q?=E7=B3=BB=E6=8E=A2=E7=B4=A2=E6=9E=B6=E5=AD=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.js                           |  4 ++
 src/utils/constants.js                        |  2 +-
 .../charts/entityDetail/EntityDetailTabs.vue  |  4 +-
 src/views/entityExplorer/EntityGraph.vue      | 38 +++++++++++++++++++
 .../entityGraphDetail/IpList.vue              | 13 +++++++
 5 files changed, 58 insertions(+), 3 deletions(-)
 create mode 100644 src/views/entityExplorer/EntityGraph.vue
 create mode 100644 src/views/entityExplorer/entityGraphDetail/IpList.vue

diff --git a/src/router/index.js b/src/router/index.js
index 6f9fcec4..9a170143 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -27,6 +27,10 @@ const routes = [
         path: '/entityDetail',
         component: () => import('@/views/entityExplorer/EntityDetail')
       },
+      {
+        path: '/entityGraph',
+        component: () => import('@/views/entityExplorer/EntityGraph')
+      },
       {
         path: '/detection',
         redirect: '/detection/securityEvent'
diff --git a/src/utils/constants.js b/src/utils/constants.js
index c19236d6..947488c7 100644
--- a/src/utils/constants.js
+++ b/src/utils/constants.js
@@ -90,7 +90,7 @@ export const entityType = {
 
 export const entityDetailTabsName = {
   informationAggregation: 'informationAggregation',
-  domainNameResolution: 'domainNameResolution',
+  relatedEntity: 'relatedEntity',
   openPort: 'openPort',
   digitalCertificate: 'digitalCertificate',
   securityEvent: 'securityEvent',
diff --git a/src/views/charts2/charts/entityDetail/EntityDetailTabs.vue b/src/views/charts2/charts/entityDetail/EntityDetailTabs.vue
index f2144697..7847081c 100644
--- a/src/views/charts2/charts/entityDetail/EntityDetailTabs.vue
+++ b/src/views/charts2/charts/entityDetail/EntityDetailTabs.vue
@@ -13,7 +13,7 @@
           <i v-if="tab.warnFlag" :class="tab.warnIcon" class="tab-pane-warn--icon"></i>
         </template>
         <information-aggregation v-if="tab.name === entityDetailTabsName.informationAggregation && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity"></information-aggregation>
-        <domain-name-resolution v-else-if="tab.name === entityDetailTabsName.domainNameResolution && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" :timeFilter="oneDayTimeFilter"></domain-name-resolution>
+        <domain-name-resolution v-else-if="tab.name === entityDetailTabsName.relatedEntity && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" :timeFilter="oneDayTimeFilter"></domain-name-resolution>
         <digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" />
         <security-event v-else-if="tab.name === entityDetailTabsName.securityEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" @checkWarn="setWarn" />
         <performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" @checkWarn="setWarn" />
@@ -80,7 +80,7 @@ export default {
     const entityType = props.entity.entityType
 
     const tabs = reactive([
-      { name: entityDetailTabsName.domainNameResolution, label: i18n.global.t('entities.relatedEntity'), icon: 'cn-icon cn-icon-domain-name-resolution' },
+      { name: entityDetailTabsName.relatedEntity, label: i18n.global.t('entities.relatedEntity'), icon: 'cn-icon cn-icon-domain-name-resolution' },
       { name: entityDetailTabsName.openPort, label: i18n.global.t('entities.openPort'), icon: 'cn-icon cn-icon-open-port' },
       // { name: entityDetailTabsName.digitalCertificate, label: i18n.global.t('entities.digitalCertificate'), icon: 'cn-icon cn-icon-digital-certificate' },
       { name: entityDetailTabsName.securityEvent, label: i18n.global.t('overall.securityEvent'), icon: 'cn-icon cn-icon-security-event', warnIcon: 'cn-icon cn-icon-warn', warnFlag: false },
diff --git a/src/views/entityExplorer/EntityGraph.vue b/src/views/entityExplorer/EntityGraph.vue
new file mode 100644
index 00000000..55f45921
--- /dev/null
+++ b/src/views/entityExplorer/EntityGraph.vue
@@ -0,0 +1,38 @@
+<template>
+  <div class="entity-graph">
+    <div class="entity-graph__chart"></div>
+    <div class="entity-graph__detail">
+      <ip-list v-if="mode === 'ipList'"></ip-list>
+    </div>
+  </div>
+</template>
+
+<script>
+import IpList from '@/views/entityExplorer/entityGraphDetail/IpList'
+export default {
+  name: 'EntityRelationship',
+  components: {
+    IpList
+  },
+  data () {
+    return {
+      mode: 'ipList' // ipList, ipDetail, domainList, domainDetail, appList, appDetail
+    }
+  }
+}
+</script>
+<style lang="scss">
+.entity-graph {
+  display: flex;
+
+  .entity-graph__chart {
+    width: calc(100% - 360px);
+  }
+
+  .entity-graph__detail {
+    width: 360px;
+    border-left: 1px solid #E2E5EC;
+    overflow: auto;
+  }
+}
+</style>
diff --git a/src/views/entityExplorer/entityGraphDetail/IpList.vue b/src/views/entityExplorer/entityGraphDetail/IpList.vue
new file mode 100644
index 00000000..2e54d99d
--- /dev/null
+++ b/src/views/entityExplorer/entityGraphDetail/IpList.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: 'IpList'
+}
+</script>
+
+<style scoped>
+
+</style>