skycurtain/ndm-web-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(device-common-card): optimize UI with NDescriptions

Browse Source
This commit is contained in:
yangsy
2025-11-06 15:57:25 +08:00
parent 7ae903f51c
commit 45cf9330cf
1 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/device-page/device-card/current-diag-card/device-common-card.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { NCard } from 'naive-ui'; import { NCard, NDescriptions, NDescriptionsItem } from 'naive-ui';
import { computed, toRefs } from 'vue'; import { computed, toRefs } from 'vue';
const props = defineProps<{ const props = defineProps<{
@@ -16,10 +16,11 @@ const commonInfoEntries = computed(() => Object.entries(commonInfo.value ?? {}))
<template #header> <template #header>
<div>设备信息</div> <div>设备信息</div>
</template> </template>
<div v-for="item in commonInfoEntries" :key="item[0]"> <NDescriptions bordered label-placement="left">
<span>{{ item[0] }}：</span> <template v-for="item in commonInfoEntries" :key="item[0]">
<span>{{ item[1] }}</span> <NDescriptionsItem :label="item[0]">{{ item[1] }}</NDescriptionsItem>
</div> </template>
</NDescriptions>
</NCard> </NCard>
</template> </template>