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

CN-879 单测用例--npm events 最底下的表格

Browse Source
This commit is contained in:
hyx
2023-02-07 17:20:26 +08:00
parent 3d18a4b285
commit e95ca314a6
2 changed files with 276 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/views/charts2/charts/npm/NpmAppEventTable.vue
View File

@@ -1,29 +1,11 @@
<template>
<div class="npm-app-event">
<!-- <div class="metric-select">
<el-select
v-model="metric"
class="option__select select-column"
popper-class="option-popper common-select"
:popper-append-to-body="false"
key="tabMetric"
@change="changeMetric"
size="mini"
width="100">
<el-option
v-for="item in options"
:key="item.label"
:label="item.label"
:value="item.value"
/>
</el-select>
<span>{{ $t('network.metric') }}：</span>
</div>-->
<el-table
id="tabTable"
ref="dataTable"
:data="tableData"
class="npm-app-event-table"
:row-class-name="rowClassName"
height="100%"
empty-text=""
>
@@ -33,34 +15,33 @@
<span class="data-column__span">{{ $t(item.label) }}</span>
</template>
<template #default="scope" :column="item">
<div class="data-app-event-table">
<div class="data-app-event-table" :test-id="`${item.prop}${scope.row.index}`">
<template v-if="item.prop === 'domain' ||item.prop === 'appName' ||item.prop === 'serverIp' ">
<span class="data-applications">{{ scope.row[item.prop] }}</span>
</template>
<template v-else-if="item.prop === 'eventSeverity'">
<template v-else-if="item.prop === 'eventSeverity'" >
<template v-if="scope.row[item.prop]==='critical'">
<div v-for="item in 5" class="red-dot" :key="item"></div>
<div v-for="item in 5" class="red-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${item}`"></div>
</template>
<template v-else-if="scope.row[item.prop]==='high'">
<div v-for="item in 4" class="red-dot" :key="item"></div>
<div class="grey-dot"></div>
<div v-for="item in 4" class="red-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${item}`"></div>
<div v-for="item in 1" class="grey-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${4+item}`"></div>
</template>
<template v-else-if="scope.row[item.prop]==='medium'">
<div v-for="item in 3" class="red-dot" :key="item"></div>
<div v-for="item in 2" class="grey-dot" :key="item"></div>
<div v-for="item in 3" class="red-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${item}`"></div>
<div v-for="item in 2" class="grey-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${3+item}`"></div>
</template>
<template v-else-if="scope.row[item.prop]==='low'">
<div v-for="item in 2" class="red-dot" :key="item"></div>
<div v-for="item in 3" class="grey-dot" :key="item"></div>
<div v-for="item in 2" class="red-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${item}`"></div>
<div v-for="item in 3" class="grey-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${2+item}`"></div>
</template>
<template v-else-if="scope.row[item.prop]==='info'">
<div v-for="item in 1" class="red-dot" :key="item"></div>
<div v-for="item in 4" class="grey-dot" :key="item"></div>
<div v-for="item in 1" class="red-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${item}`"></div>
<div v-for="item in 4" class="grey-dot" :key="item" :test-id="`eventSeverityValue${scope.row.index}${1+item}`"></div>
</template>
<span class="data-severity">{{ scope.row[item.prop] }}</span>
</template>
<template v-else-if="item.prop === 'eventType'">
<!-- <span class="data-eventType" v-for="type in scope.row[item.prop]">{{type}}</span>-->
<span class="data-eventType">{{ scope.row[item.prop] }}</span>
</template>
<template v-else-if="item.prop === 'count'">
@@ -153,6 +134,10 @@ export default {
this.init()
},
methods: {
rowClassName ({ row, rowIndex }) {
// 把每一行的索引放进row
row.index = rowIndex
},
init () {
this.toggleLoading(true)
this.isNoData = false