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

fix: 实体关系模块右侧列表详情样式调整

Browse Source
This commit is contained in:
刘洪洪
2023-06-30 10:41:29 +08:00
parent 30883802cb
commit 0e752cb3a3
6 changed files with 138 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/entityExplorer/entityGraphDetail/AppOrDomainList.vue
View File

@@ -6,7 +6,7 @@
<i class="graph-list-header-icon" :class="entityIcon"></i>
<span>{{ $t(entityName) }}</span>
</div>
<div class="graph-list-header-number" style="margin-bottom: 30px">
<div class="graph-list-header-number" style="margin-bottom: 24px">
{{ $t('entity.graph.associatedQuantity') }}：<span>2</span>
</div>
</div>
@@ -16,7 +16,7 @@
<div>
<div class="digital-certificate">
<div class="digital-certificate-header padding-b-20">
<div class="digital-certificate-header padding-b-12">
<div class="digital-certificate-header__icon graph-header__icon"></div>
<div class="graph-list-content-header ">
{{ $t('entity.graph.expandedEntityQuantity') }}:&nbsp;&nbsp;

20
src/views/entityExplorer/entityGraphDetail/GraphDetail.vue
View File

@@ -4,7 +4,7 @@
<div style="display: flex">
<div class="graph-detail__icon"><i :class="iconClass"></i></div>
<div style="display: flex;flex-direction: column;">
<div class="graph-detail-header">
<div class="entity-graph-type">{{ entityType[entity.entityType] }}</div>
<div class="graph-basic-info">
<div class="graph-basic-info-name__block">
@@ -24,7 +24,7 @@
<div class="digital-certificate graph-basic-info__block">
<div class="digital-certificate-header padding-b-10">
<div class="digital-certificate-header__icon graph-header__icon"></div>
<div class="digital-certificate-header-name">
<div class="graph-basic-info__block-title">
{{ $t('overall.basicInfo') }}
</div>
</div>
@@ -41,12 +41,12 @@
<div class="digital-certificate graph-basic-info__block">
<div class="digital-certificate-header padding-b-10">
<div class="digital-certificate-header__icon graph-header__icon"></div>
<div class="digital-certificate-header-name">
<div class="graph-basic-info__block-title">
{{ $t('entity.graph.relationshipExpansion') }}
</div>
</div>
<div class="graph-basic-info__block-content">
<div class="graph-basic-info__block-content" style="margin-top: -4px;">
<div v-for="item in relationList" :key="item.name" @click="expandRelation(item.name)">
<el-popover
v-if="item.value.length === item.total"
@@ -72,7 +72,7 @@
<div v-else class="graph-content-item graph-content-relationship-item">
<div class="graph-relationship-item-label">
<i class="margin-r-6" :class="item.icon"></i>
<i class="graph-relationship-item-label-icon margin-r-6" :class="item.icon"></i>
<span>{{ item.label }}：</span>
</div>
<div class="graph-relationship-item-value">
@@ -94,7 +94,7 @@
<div class="digital-certificate graph-basic-info__block">
<div class="digital-certificate-header padding-b-10">
<div class="digital-certificate-header__icon graph-header__icon"></div>
<div class="digital-certificate-header-name">
<div class="graph-basic-info__block-title">
{{ $t('entity.graph.labels') }}
</div>
</div>
@@ -103,7 +103,7 @@
<div class="graph-tag-list">
<div v-for="ic in tagList" :key="ic.key">
<div class="entity-tag graph-tag-item" :class="`entity-tag--level-two-${ic.type}`">
{{ic.value}}
<span>{{ic.value}}</span>
</div>
</div>
</div>
@@ -185,10 +185,10 @@ export default {
switch (props.entity.entityType) {
case 'ip': {
detailCards.value = _.concat(detailCards.value,
{ name: 'asn', label: 'ASN', value: '' },
{ name: 'asn', label: i18n.global.t('entities.asNumber'), value: '' },
{ name: 'asOrg', label: i18n.global.t('entities.asOrg'), value: '' },
// { name: 'asSubnet', label: i18n.global.t('entities.asSubnet'), value: '' },
{ name: 'isp', label: 'ISP', value: '' },
{ name: 'asSubnet', label: i18n.global.t('entities.asSubnet'), value: '' },
{ name: 'isp', label: i18n.global.t('entities.graph.isp'), value: '' },
{ name: 'location', label: i18n.global.t('entities.geographicLocation'), value: '' }
// { name: 'dnsPtr', label: 'DNS PTR', value: '' }
)

22
src/views/entityExplorer/entityGraphDetail/IpList.vue
View File

@@ -15,17 +15,21 @@
</div>
<div class="graph-list-expand-btn-block">
<el-button type="primary" class="graph-list-expand-btn">
<span>
<i class="cn-icon cn-icon-expand-continue graph-expand-continue"></i>
{{ $t('entity.graph.continueToExpand') }}
</span>
</el-button>
<div class="graph-list-expand-btn">
<i class="cn-icon cn-icon-expand-continue graph-expand-continue"></i>
{{ $t('entity.graph.continueToExpand') }}
</div>
<!-- <el-button type="primary" class="graph-list-expand-btn">-->
<!-- <span>-->
<!-- <i class="cn-icon cn-icon-expand-continue graph-expand-continue"></i>-->
<!-- {{ $t('entity.graph.continueToExpand') }}-->
<!-- </span>-->
<!-- </el-button>-->
</div>
<div>
<div class="digital-certificate">
<div class="digital-certificate-header padding-b-20">
<div class="digital-certificate-header padding-b-16">
<div class="digital-certificate-header__icon graph-header__icon"></div>
<div class="graph-list-content-header ">
{{ $t('entity.graph.expandedEntityQuantity') }}:&nbsp;&nbsp;
@@ -37,9 +41,9 @@
<div v-for="(item, index) in ipList" :key="index" @mouseenter="onMouseenter(item)">
<div class="graph-list-item-ip"><span @click="expandDetail">{{ item.ip }}</span></div>
<div class="graph-list-item-block">
<div class="graph-list-item padding-b-10">
<div class="graph-list-item padding-b-4">
<div class="graph-list-item-label">{{ $t('overall.location') }}:</div>
<div class="graph-list-item-value graph-list-item-value1">
<div class="graph-list-item-value graph-list-item-value1" style="display: flex;align-items: center;">
<img :src="require(`../../../../public/images/flag/${item.flag}.svg`)" class="graph-list-country-flag"/>
<span>{{ item.city }}</span>
</div>