SNMPDescription.vue
2.22 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<script lang="ts" setup>
import { Table } from 'ant-design-vue';
import { computed, h } from 'vue';
import { SNMPDataTypeEnum, SNMPRangeNameEnum } from './const';
import { DeviceRecord } from '/@/api/device/model/deviceModel';
import { CollapseContainer } from '/@/components/Container';
import { DescItem, Description, useDescription } from '/@/components/Description';
type TransportConfiguration = DeviceRecord['profileData']['transportConfiguration'];
const props = defineProps<{
record: TransportConfiguration;
}>();
const getSNMPList = computed(() => {
const { record } = props;
return record.communicationConfigs;
});
const [register] = useDescription({
layout: 'vertical',
column: 2,
data: props.record,
schema: [
{
label: '接入协议',
field: 'type',
span: 2,
},
{
label: '超时毫秒',
field: 'timeoutMs',
},
{
label: '重试次数',
field: 'retries',
},
],
});
const schema: DescItem[] = [
{
label: '范围',
field: 'spec',
render: (val: string) => getTitle(val),
},
{
label: '查询频率(毫秒)',
field: 'queryingFrequencyMs',
},
{
label: 'Mapping',
field: 'mappings',
render: (val) => {
return h(Table, {
size: 'small',
bordered: true,
pagination: false,
columns: [
{
title: '数据类型',
dataIndex: 'dataType',
customRender: ({ text }) => SNMPDataTypeEnum[text],
},
{
title: 'DataKey',
dataIndex: 'key',
},
{
title: 'OID',
dataIndex: 'oid',
},
],
dataSource: val,
});
},
},
];
const getTitle = (range: string) => {
return SNMPRangeNameEnum[range];
};
</script>
<template>
<Description @register="register" />
<CollapseContainer
v-for="(item, index) in getSNMPList"
:key="index"
class="mt-4"
:title="getTitle(item.spec)"
>
<Description :data="item" layout="vertical" :column="2" :schema="schema" />
</CollapseContainer>
</template>