diff --git a/frontend/src/views/Cluster/MachineDetail/Index.vue b/frontend/src/views/Cluster/MachineDetail/Index.vue
index a2fc778b161175366ae20f08629274cde786877e..32250bdc0ae9c395930d4ad1185e71df3f51eaca 100644
--- a/frontend/src/views/Cluster/MachineDetail/Index.vue
+++ b/frontend/src/views/Cluster/MachineDetail/Index.vue
@@ -10,7 +10,9 @@
             <el-tab-pane name="service" label="服务信息">
                 <Service />
             </el-tab-pane>
-            <el-tab-pane name="network" label="网络配置"> 网络配置 </el-tab-pane>
+            <el-tab-pane name="network" label="网络配置">
+                <Network />
+            </el-tab-pane>
             <el-tab-pane name="systl" label="内核参数"> 内核参数 </el-tab-pane>
             <el-tab-pane name="npm" label="软件包"> 软件包 </el-tab-pane>
             <el-tab-pane name="terminal" label="远程终端"> 远程终端 </el-tab-pane>
@@ -24,6 +26,7 @@ import { ref } from "vue";
 import Base from "./Base.vue";
 import User from "./User.vue";
 import Service from "./Service.vue";
+import Network from "./Network.vue";
 
 const activePane = ref("base")
 
diff --git a/frontend/src/views/Cluster/MachineDetail/Network.vue b/frontend/src/views/Cluster/MachineDetail/Network.vue
new file mode 100644
index 0000000000000000000000000000000000000000..ce3120cbacd8063b8b081a59d7e9625af5cc7be4
--- /dev/null
+++ b/frontend/src/views/Cluster/MachineDetail/Network.vue
@@ -0,0 +1,22 @@
+<template>
+    <div class="content">
+        <br />
+        <h3>IPv4:</h3>
+        <br />
+        <el-descriptions :column="2" size="medium" border>
+            <el-descriptions-item label="IP分配">{{ net.BOOTPROTO === 'dhcp' ? '动态DHCP' : '手动' }}</el-descriptions-item>
+            <el-descriptions-item label="IPv4地址">{{ net.IPADDR }}</el-descriptions-item>
+            <el-descriptions-item label="IPv4子网掩码">{{ net.NETMASK || '无' }}</el-descriptions-item>
+            <el-descriptions-item label="IPv4网关">{{ net.GATEWAY }}</el-descriptions-item>
+            <el-descriptions-item label="IPv4首选DNS">{{ net.DNS1 }}</el-descriptions-item>
+            <el-descriptions-item label="IPv4备选DNS">{{ net.DNS2 || '无' }}</el-descriptions-item>
+        </el-descriptions>
+    </div>
+</template>
+<script lang="ts" setup>
+import { ref } from "vue";
+
+const net = ref<any>({})
+
+</script>
+<style lang="scss" scoped></style>
\ No newline at end of file