fix: entity详情的tabs添加loading
This commit is contained in:
@@ -8,15 +8,15 @@
|
||||
:name="tab.name"
|
||||
class="tab-pane--border-card">
|
||||
<template #label>
|
||||
<!-- <div class="el-tabs__active-bar is-top" style="width: 80.9998px; transform: translateX(177px);"></div>-->
|
||||
<!--<div class="el-tabs__active-bar is-top" style="width: 80.9998px; transform: translateX(177px);"></div>-->
|
||||
<i :class="tab.icon"></i>{{tab.label}}
|
||||
</template>
|
||||
<information-aggregation v-if="tab.name === entityDetailTabsName.informationAggregation"></information-aggregation>
|
||||
<domain-name-resolution v-else-if="tab.name === entityDetailTabsName.domainNameResolution"></domain-name-resolution>
|
||||
<digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate" />
|
||||
<security-event v-else-if="tab.name === entityDetailTabsName.securityEvent" :timeFilter="timeFilter" />
|
||||
<performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent" />
|
||||
<open-port v-else-if="tab.name === entityDetailTabsName.openPort"></open-port>
|
||||
<information-aggregation v-if="tab.name === entityDetailTabsName.informationAggregation && tab.name === activeTab" @toggleLoading="setLoading"></information-aggregation>
|
||||
<domain-name-resolution v-else-if="tab.name === entityDetailTabsName.domainNameResolution && tab.name === activeTab" @toggleLoading="setLoading"></domain-name-resolution>
|
||||
<digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate && tab.name === activeTab" @toggleLoading="setLoading" />
|
||||
<security-event v-else-if="tab.name === entityDetailTabsName.securityEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="timeFilter" />
|
||||
<performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent && tab.name === activeTab" @toggleLoading="setLoading" />
|
||||
<open-port v-else-if="tab.name === entityDetailTabsName.openPort && tab.name === activeTab" @toggleLoading="setLoading"></open-port>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
@@ -60,7 +60,7 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.toggleLoading(false)
|
||||
// this.toggleLoading(false)
|
||||
this.timer = setTimeout(() => {
|
||||
this.handleActiveBar(this.activeTab)
|
||||
}, 200)
|
||||
@@ -108,6 +108,9 @@ export default {
|
||||
const activeBar = document.querySelector('.entity-detail-tabs .entity-detail-tabs__active-bar')
|
||||
activeBar.style.cssText += `width: ${clientWidth + 2}px; left: ${offsetLeft + clientLeft - 1}px;`
|
||||
}
|
||||
},
|
||||
setLoading (loading) {
|
||||
this.toggleLoading(loading)
|
||||
}
|
||||
},
|
||||
beforeUnmount () {
|
||||
|
||||
@@ -81,6 +81,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import chartMixin from '@/views/charts2/chart-mixin'
|
||||
|
||||
export default {
|
||||
name: 'InformationAggregation',
|
||||
data () {
|
||||
@@ -88,6 +90,7 @@ export default {
|
||||
informationAggregationList: []
|
||||
}
|
||||
},
|
||||
mixins: [chartMixin],
|
||||
methods: {
|
||||
intelligenceContentClass ({ row, column, rowIndex, columnIndex }) {
|
||||
if (columnIndex === 2) {
|
||||
@@ -96,6 +99,12 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.toggleLoading(true)
|
||||
// 模拟loading,后续添加post请求时记得删除
|
||||
const timer = setTimeout(() => {
|
||||
this.toggleLoading(false)
|
||||
clearTimeout(timer)
|
||||
}, 150)
|
||||
this.informationAggregationList = [
|
||||
{
|
||||
discoveryTime: '2022-04-12',
|
||||
|
||||
Reference in New Issue
Block a user