diff --git a/src/components/device/device-card/components/current-diag/device-common-card.vue b/src/components/device/device-card/components/current-diag/device-common-card.vue
index b30f196..2c3d189 100644
--- a/src/components/device/device-card/components/current-diag/device-common-card.vue
+++ b/src/components/device/device-card/components/current-diag/device-common-card.vue
@@ -1,16 +1,20 @@
 <script setup lang="ts">
-import { NCard, NDescriptions, NDescriptionsItem } from 'naive-ui';
+import { NCard, NDescriptions, NDescriptionsItem, NFlex, NText } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
 const props = defineProps<{
-  commonInfo?: Record<string, string>;
+  commonInfo?: Array<{
+    title: string;
+    items: Array<{
+      label: string;
+      value: string;
+    }>;
+  }>;
 }>();
 
 const { commonInfo } = toRefs(props);
 
-const showCard = computed(() => !!commonInfo.value);
-
-const commonInfoEntries = computed(() => Object.entries(commonInfo.value ?? {}));
+const showCard = computed(() => (commonInfo.value?.length ?? 0) > 0);
 </script>
 
 <template>
@@ -18,11 +22,20 @@ const commonInfoEntries = computed(() => Object.entries(commonInfo.value ?? {}))
     <template #header>
       <div>设备信息</div>
     </template>
-    <NDescriptions bordered label-placement="left" :columns="2">
-      <template v-for="item in commonInfoEntries" :key="item[0]">
-        <NDescriptionsItem :label="item[0]">{{ item[1] }}</NDescriptionsItem>
-      </template>
-    </NDescriptions>
+    <template v-if="!!commonInfo && commonInfo.length > 0">
+      <NFlex vertical :size="16">
+        <template v-for="({ title, items }, index) in commonInfo" :key="`${title}-${index}`">
+          <NFlex vertical>
+            <NText strong :depth="3">{{ title }}</NText>
+            <NDescriptions bordered :label-placement="'left'" :columns="2">
+              <template v-for="({ label, value }, index) in items" :key="`${label}-${index}`">
+                <NDescriptionsItem :label="label">{{ value }}</NDescriptionsItem>
+              </template>
+            </NDescriptions>
+          </NFlex>
+        </template>
+      </NFlex>
+    </template>
   </NCard>
 </template>
 
diff --git a/src/components/device/device-card/components/current-diag/index.ts b/src/components/device/device-card/components/current-diag/index.ts
index 265d85c..f6b2f90 100644
--- a/src/components/device/device-card/components/current-diag/index.ts
+++ b/src/components/device/device-card/components/current-diag/index.ts
@@ -1,3 +1,4 @@
+import type { ComponentInstance } from 'vue';
 import DeviceCommonCard from './device-common-card.vue';
 import DeviceHardwareCard from './device-hardware-card.vue';
 import DeviceHeaderCard from './device-header-card.vue';
@@ -9,6 +10,8 @@ import SecurityBoxEnvCard from './security-box-env-card.vue';
 import SwitchPortCard from './switch-port-card.vue';
 import SwitchPortLinkModal from './switch-port-link-modal.vue';
 
+export type DeviceCommonCardProps = ComponentInstance<typeof DeviceCommonCard>['$props'];
+
 export {
   DeviceCommonCard,
   DeviceHardwareCard,