fix: harden disk monitor configuration flows

frontend/src/views/systemMonitor/index.vue

@@ -1,9 +1,99 @@
 <template>
-    <div>系统监控页面占位</div>
+    <div class="system-monitor-page">
+        <div class="page-header">
+            <h2 class="page-title">系统监控</h2>
+            <p class="page-description">从这里进入各类运行监控能力，目前已接入磁盘监控配置入口。</p>
+        </div>
+
+        <div class="monitor-grid">
+            <section class="monitor-card">
+                <div class="card-content">
+                    <h3 class="card-title">磁盘监控</h3>
+                    <p class="card-description">
+                        配置多盘符监控、预警与告警阈值、启动监控、定时监控以及通知目标。
+                    </p>
+                </div>
+                <el-button type="primary" @click="openDiskMonitor">进入配置</el-button>
+            </section>
+        </div>
+    </div>
 </template>
 
 <script setup lang="ts">
+import { useRouter } from 'vue-router'
+
 defineOptions({
     name: 'SystemMonitorPage'
 })
+
+const router = useRouter()
+
+const openDiskMonitor = async () => {
+    // 系统监控页作为模块入口，保持磁盘监控返回链路闭环。
+    await router.push('/systemMonitor/diskMonitor')
+}
 </script>
+
+<style scoped lang="scss">
+.system-monitor-page {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    padding: 20px;
+}
+
+.page-header {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+}
+
+.page-title {
+    margin: 0;
+    font-size: 22px;
+    color: #111827;
+}
+
+.page-description {
+    margin: 0;
+    font-size: 13px;
+    color: #6b7280;
+}
+
+.monitor-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 16px;
+}
+
+.monitor-card {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    gap: 16px;
+    min-height: 180px;
+    padding: 20px;
+    border: 1px solid #e5e7eb;
+    border-radius: 12px;
+    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
+}
+
+.card-content {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+.card-title {
+    margin: 0;
+    font-size: 18px;
+    color: #111827;
+}
+
+.card-description {
+    margin: 0;
+    font-size: 13px;
+    line-height: 1.7;
+    color: #4b5563;
+}
+</style>