<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>星尘分布式服务平台</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css">
<style>
body { background-color: #f0f2f5; }
.hero { background: linear-gradient(135deg, #1a1f36 0%, #2d3561 100%); color: #fff; padding: 60px 0 40px; }
.hero h1 { font-size: 2.4rem; font-weight: 700; }
.hero p { font-size: 1.1rem; opacity: .85; }
.card-link { text-decoration: none; color: inherit; }
.card-link:hover .feature-card { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.feature-card { border: none; border-radius: 12px; transition: all .2s ease; }
.feature-card .card-body { padding: 2rem; }
.feature-icon { width: 56px; height: 56px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; margin-bottom: 1rem; }
.feature-card .card-title { font-weight: 600; font-size: 1.1rem; }
.feature-card .card-text { color: #6c757d; font-size: .9rem; }
.badge-new { font-size: .7rem; }
</style>
</head>
<body>
<div class="hero">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-8">
<h1><i class="bi bi-stars me-2"></i>星尘分布式服务平台</h1>
<p class="mb-0">配置中心 · 集群管理 · 远程发布 · 服务治理 · 性能监控</p>
</div>
<div class="col-lg-4 text-lg-end mt-3 mt-lg-0">
<span class="badge bg-light text-dark fs-6 px-3 py-2">v3.7</span>
</div>
</div>
</div>
</div>
<div class="container py-5">
<div class="row g-4">
<!-- 仪表盘 -->
<div class="col-md-6 col-lg-4">
<a href="dashboard.html" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon bg-primary bg-opacity-10 text-primary">
<i class="bi bi-speedometer2"></i>
</div>
<h5 class="card-title">仪表盘</h5>
<p class="card-text">系统运行概览，实时监控各服务健康状态、节点数量及请求统计。</p>
</div>
</div>
</a>
</div>
<!-- 项目工作台 -->
<div class="col-md-6 col-lg-4">
<a href="project-workspace.html" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon bg-success bg-opacity-10 text-success">
<i class="bi bi-grid-1x2-fill"></i>
</div>
<h5 class="card-title">
项目工作台
<span class="badge bg-success badge-new ms-1">NEW</span>
</h5>
<p class="card-text">统一项目工作台，集中管理项目配置、部署、节点与监控数据。</p>
</div>
</div>
</a>
</div>
<!-- 项目管理 -->
<div class="col-md-6 col-lg-4">
<a href="projects.html" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon bg-info bg-opacity-10 text-info">
<i class="bi bi-collection-fill"></i>
</div>
<h5 class="card-title">
项目管理
<span class="badge bg-info text-dark badge-new ms-1">NEW</span>
</h5>
<p class="card-text">管理所有应用项目，支持按项目维度查看配置、节点和部署信息。</p>
</div>
</div>
</a>
</div>
<!-- 节点管理 -->
<div class="col-md-6 col-lg-4">
<a href="nodes.html" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon bg-warning bg-opacity-10 text-warning">
<i class="bi bi-hdd-network-fill"></i>
</div>
<h5 class="card-title">节点管理</h5>
<p class="card-text">查看和管理所有注册的服务节点，支持远程命令、升级与配置下发。</p>
</div>
</div>
</a>
</div>
<!-- 监控中心 -->
<div class="col-md-6 col-lg-4">
<a href="monitor.html" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon bg-danger bg-opacity-10 text-danger">
<i class="bi bi-activity"></i>
</div>
<h5 class="card-title">监控中心</h5>
<p class="card-text">应用性能监控（APM），追踪请求链路，分析响应时间与错误分布。</p>
</div>
</div>
</a>
</div>
<!-- 发布部署 -->
<div class="col-md-6 col-lg-4">
<a href="deploy.html" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon bg-purple bg-opacity-10" style="background-color:#f3e8ff; color:#7c3aed;">
<i class="bi bi-rocket-takeoff-fill"></i>
</div>
<h5 class="card-title">发布部署</h5>
<p class="card-text">远程自动化部署，支持灰度发布、版本回滚与批量升级操作。</p>
</div>
</div>
</a>
</div>
<!-- 配置中心 -->
<div class="col-md-6 col-lg-4">
<a href="#" class="card-link">
<div class="card feature-card h-100">
<div class="card-body">
<div class="feature-icon" style="background-color:#fff7ed; color:#ea580c;">
<i class="bi bi-sliders2-vertical"></i>
</div>
<h5 class="card-title">配置中心</h5>
<p class="card-text">集中管理应用配置，支持多环境、动态下发与版本历史对比。</p>
</div>
</div>
</a>
</div>
</div>
</div>
<footer class="text-center text-muted py-4" style="font-size:.85rem;">
© 2024 NewLife · 星尘分布式服务平台
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
|