From a6511508ad8180af9ebe549b1417cea373d21fcf Mon Sep 17 00:00:00 2001
From: hyx <hanyuxia@iie.ac.cn>
Date: Wed, 10 May 2023 16:50:15 +0800
Subject: [PATCH] =?UTF-8?q?CN-990=20=E5=AE=9E=E4=BD=93=E8=AF=A6=E6=83=85--?=
 =?UTF-8?q?=E6=83=85=E6=8A=A5=E8=81=9A=E5=90=88tab=E5=BC=80=E5=8F=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/components/index.scss          |   1 +
 .../views/charts2/informationAggregation.scss |  74 ++++++
 .../tabs/InformationAggregation.vue           | 243 +++++++++++++++++-
 3 files changed, 316 insertions(+), 2 deletions(-)
 create mode 100644 src/assets/css/components/views/charts2/informationAggregation.scss

diff --git a/src/assets/css/components/index.scss b/src/assets/css/components/index.scss
index 53836a53..9835c659 100644
--- a/src/assets/css/components/index.scss
+++ b/src/assets/css/components/index.scss
@@ -66,6 +66,7 @@
 @import './views/charts2/linkTrafficSankey';
 @import './views/charts2/linkDirectionGrid';
 @import './views/charts2/domainNameResolution.scss';
+@import './views/charts2/informationAggregation.scss';
 @import 'views/charts2/linkTrafficLine';
 @import 'views/charts2/dnsTrafficLine';
 @import 'views/charts2/dnsRecentEvents';
diff --git a/src/assets/css/components/views/charts2/informationAggregation.scss b/src/assets/css/components/views/charts2/informationAggregation.scss
new file mode 100644
index 00000000..024e741f
--- /dev/null
+++ b/src/assets/css/components/views/charts2/informationAggregation.scss
@@ -0,0 +1,74 @@
+.information-aggregation__table {
+  .intelligence-content {
+    padding-top:10px !important;
+    padding-bottom:4px !important;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-start;
+    .information-aggregation-tags {
+      display: flex;
+      flex-direction: row;
+      justify-content: center;
+      align-items: flex-start;
+      margin-bottom:6px;
+    }
+  }
+  .information-aggregation__valid {
+    background: #eff3e9;
+    border-radius: 10px;
+    font-size: 12px;
+    color: #7E9F54;
+    font-weight: 500;
+    width:fit-content;
+    padding-left:10px;
+    padding-right:10px;
+    height: 20px;
+  }
+  .information-aggregation__invalid {
+    background: #ededed;
+    border-radius: 10px;
+    font-size: 12px;
+    color: #717171;
+    font-weight: 500;
+    width:fit-content;
+    padding-left:10px;
+    padding-right:10px;
+    height: 20px;
+  }
+
+  .el-table {
+    font-size: 12px;
+    color: #353636;
+    font-weight: 400;
+  }
+  .el-table thead {
+    font-size: 12px;
+    line-height: 12px;
+    color: #353636;
+    font-weight: 500;
+    height:32px;
+  }
+
+  .el-table th {
+    padding: 4px 0;
+  }
+
+  .el-table--border th, .el-table--border td {
+    border-right: 0px !important;
+  }
+
+  .el-table--border {
+    //border: 1px solid #E2E5EC;
+    border-radius: 4px;
+  }
+}
+.margin-r-6{
+  margin-right: 6px;
+}
+.margin-b-6{
+  margin-bottom: 6px;
+}
+.padding-0{
+  padding:0px !important;
+}
\ No newline at end of file
diff --git a/src/views/charts2/charts/entityDetail/tabs/InformationAggregation.vue b/src/views/charts2/charts/entityDetail/tabs/InformationAggregation.vue
index a508b90d..27ed0fc0 100644
--- a/src/views/charts2/charts/entityDetail/tabs/InformationAggregation.vue
+++ b/src/views/charts2/charts/entityDetail/tabs/InformationAggregation.vue
@@ -1,9 +1,248 @@
 <template>
-  情报聚合
+  <div class="information-aggregation__table">
+    <el-table
+            style="width: 100%"
+            tooltip-effect="light"
+            border
+            id="informationAggregationTable"
+            ref="informationAggregationTable"
+            :data="informationAggregationList"
+            :cell-class-name="intelligenceContentClass"
+    >
+      <el-table-column
+              key="discoveryTime"
+              width="150px"
+              :label="$t('entities.tab.informationAggregation.discoveryTime')"
+              prop="discoveryTime"
+      ></el-table-column>
+      <el-table-column
+              key="updateTime"
+              width="150px"
+              :label="$t('entities.tab.informationAggregation.updateTime')"
+              prop="updateTime"
+      ></el-table-column>
+      <el-table-column
+              key="intelligenceContent"
+              :label="$t('entities.tab.informationAggregation.intelligenceContent')"
+              prop="intelligenceContent"
+      >
+        <template #default="scope">
+          <div class="intelligence-content">
+            <div class="information-aggregation-tags">
+              <template v-for="ic in scope.row.intelligenceContent" >
+                <template v-if="ic.type === 0" >
+                  <div v-if="ic.threatLevel === -1" class="entity-tag entity-tag--small entity-tag--level-one-negative margin-r-6">
+                    {{ic.value}}
+                  </div>
+                  <div v-else-if="ic.threatLevel === 0" class="entity-tag entity-tag--small entity-tag--level-one-normal margin-r-6">
+                    {{ic.value}}
+                  </div>
+                  <div v-else-if="ic.threatLevel === 1" class="entity-tag entity-tag--small entity-tag--level-one-positive margin-r-6">
+                    {{ic.value}}
+                  </div>
+                </template>
+              </template>
+            </div>
+            <div class="information-aggregation-tags">
+              <div v-for="ic in scope.row.intelligenceContent" >
+                <div v-if="ic.type === 1">
+                  <div v-if="ic.threatLevel === -1" class="entity-tag entity-tag--small entity-tag--level-two-negative margin-r-6">
+                    {{ic.value}}
+                  </div>
+                  <div v-else-if="ic.threatLevel === 0" class="entity-tag entity-tag--small entity-tag--level-two-normal margin-r-6">
+                    {{ic.value}}
+                  </div>
+                  <div v-else-if="ic.threatLevel === 1" class="entity-tag entity-tag--small entity-tag--level-two-positive margin-r-6">
+                    {{ic.value}}
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column
+              key="status"
+              width="150px"
+              :label="$t('entities.tab.informationAggregation.status')"
+              prop="status"
+      >
+        <template #default="scope">
+          <div v-if="scope.row.status === 1" class="information-aggregation__valid">
+            有效
+          </div>
+          <div v-else-if="scope.row.status === 0" class="information-aggregation__invalid">
+            无效
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
 <script>
 export default {
-  name: 'InformationAggregation'
+  name: 'InformationAggregation',
+  data () {
+    return {
+      informationAggregationList: []
+    }
+  },
+  methods: {
+    intelligenceContentClass ({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 2) {
+        return 'padding-0'
+      }
+    }
+  },
+  mounted () {
+    this.informationAggregationList = [
+      {
+        discoveryTime: '2022-04-12',
+        updateTime: '2022-04-13',
+        intelligenceContent: [
+          {
+            type: 0,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '安全'
+          },
+          {
+            type: 0,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '工具'
+          },
+          {
+            type: 1,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '信息技术'
+          },
+          {
+            type: 1,
+            threatLevel: 0, // 红色：-1；灰色：0；绿色：1；
+            value: '互联网'
+          }
+        ],
+        status: 1// 1有效；0无效；
+      },
+      {
+        discoveryTime: '2022-04-11',
+        updateTime: '2022-04-14',
+        intelligenceContent: [
+          {
+            type: 0,
+            threatLevel: -1, // 红色：-1；灰色：0；绿色：1；
+            value: '恶意软件'
+          },
+          {
+            type: 0,
+            threatLevel: -1, // 红色：-1；灰色：0；绿色：1；
+            value: '垃圾软件'
+          },
+          {
+            type: 1,
+            threatLevel: -1, // 红色：-1；灰色：0；绿色：1；
+            value: '病毒软件'
+          },
+          {
+            type: 1,
+            threatLevel: -1, // 红色：-1；灰色：0；绿色：1；
+            value: '病毒软件'
+          },
+          {
+            type: 1,
+            threatLevel: 0, // 红色：-1；灰色：0；绿色：1；
+            value: '互联网'
+          }
+        ],
+        status: 1// 1有效；0无效；
+      },
+      {
+        discoveryTime: '2022-04-12',
+        updateTime: '2022-04-12',
+        intelligenceContent: [
+          {
+            type: 0,
+            threatLevel: -1, // 红色：-1；灰色：0；绿色：1；
+            value: '恶意软件'
+          },
+          {
+            type: 1,
+            threatLevel: -1, // 红色：-1；灰色：0；绿色：1；
+            value: '病毒软件'
+          },
+          {
+            type: 1,
+            threatLevel: 0, // 红色：-1；灰色：0；绿色：1；
+            value: '互联网'
+          }
+        ],
+        status: 0// 1有效；0无效；
+      },
+      {
+        discoveryTime: '2022-04-12',
+        updateTime: '2022-04-12',
+        intelligenceContent: [
+          {
+            type: 0,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '安全'
+          },
+          {
+            type: 0,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '工具'
+          },
+          {
+            type: 1,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '信息技术'
+          },
+          {
+            type: 1,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '信息技术'
+          },
+          {
+            type: 1,
+            threatLevel: 0, // 红色：-1；灰色：0；绿色：1；
+            value: '互联网'
+          }
+        ],
+        status: 1// 1有效；0无效；
+      },
+      {
+        discoveryTime: '2022-04-12',
+        updateTime: '2022-04-12',
+        intelligenceContent: [
+          {
+            type: 0,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '安全'
+          },
+          {
+            type: 0,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '工具'
+          },
+          {
+            type: 1,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '信息技术'
+          },
+          {
+            type: 1,
+            threatLevel: 1, // 红色：-1；灰色：0；绿色：1；
+            value: '信息技术'
+          },
+          {
+            type: 1,
+            threatLevel: 0, // 红色：-1；灰色：0；绿色：1；
+            value: '互联网'
+          }
+        ],
+        status: 0// 1有效；0无效；
+      }
+    ]
+  }
 }
 </script>