| | <!DOCTYPE html>
|
| | <html lang="zh-CN">
|
| | <head>
|
| | <meta charset="UTF-8">
|
| | <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| | <title>WebShell 系统</title>
|
| | <link href="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
|
| | <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
| | <style>
|
| | body {
|
| | background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
| | min-height: 100vh;
|
| | font-family: 'Arial', sans-serif;
|
| | }
|
| |
|
| | .card {
|
| | border: none;
|
| | border-radius: 15px;
|
| | box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
|
| | transition: transform 0.3s ease, box-shadow 0.3s ease;
|
| | }
|
| |
|
| | .card:hover {
|
| | transform: translateY(-5px);
|
| | box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
|
| | }
|
| |
|
| | .feature-icon {
|
| | font-size: 4rem;
|
| | margin-bottom: 1rem;
|
| | background: linear-gradient(45deg, #667eea, #764ba2);
|
| | -webkit-background-clip: text;
|
| | -webkit-text-fill-color: transparent;
|
| | background-clip: text;
|
| | }
|
| |
|
| | .btn-custom {
|
| | background: linear-gradient(45deg, #667eea, #764ba2);
|
| | border: none;
|
| | border-radius: 25px;
|
| | padding: 12px 30px;
|
| | color: white;
|
| | font-weight: 600;
|
| | transition: all 0.3s ease;
|
| | }
|
| |
|
| | .btn-custom:hover {
|
| | transform: translateY(-2px);
|
| | box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
|
| | color: white;
|
| | }
|
| |
|
| | .main-title {
|
| | color: white;
|
| | text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
|
| | margin-bottom: 3rem;
|
| | }
|
| | </style>
|
| | </head>
|
| | <body>
|
| | <div class="container py-5">
|
| | <div class="row justify-content-center">
|
| | <div class="col-md-10">
|
| | <h1 class="text-center main-title mb-5">
|
| | <i class="fas fa-terminal me-3"></i>WebShell 管理系统
|
| | </h1>
|
| |
|
| | <div class="row g-4">
|
| |
|
| | <div class="col-md-6">
|
| | <div class="card h-100 text-center p-4">
|
| | <div class="card-body">
|
| | <i class="fas fa-folder-open feature-icon"></i>
|
| | <h3 class="card-title mb-3">文件管理</h3>
|
| | <p class="card-text text-muted mb-4">
|
| | 浏览、上传、下载、编辑和管理服务器文件。支持创建文件夹、重命名、删除等操作。
|
| | </p>
|
| | <ul class="list-unstyled text-start mb-4">
|
| | <li><i class="fas fa-check text-success me-2"></i>文件浏览和导航</li>
|
| | <li><i class="fas fa-check text-success me-2"></i>文件上传下载</li>
|
| | <li><i class="fas fa-check text-success me-2"></i>在线编辑器</li>
|
| | <li><i class="fas fa-check text-success me-2"></i>文件操作管理</li>
|
| | </ul>
|
| | <a href="/files" class="btn btn-custom">
|
| | <i class="fas fa-folder me-2"></i>进入文件管理
|
| | </a>
|
| | </div>
|
| | </div>
|
| | </div>
|
| |
|
| |
|
| | <div class="col-md-6">
|
| | <div class="card h-100 text-center p-4">
|
| | <div class="card-body">
|
| | <i class="fas fa-terminal feature-icon"></i>
|
| | <h3 class="card-title mb-3">终端模拟器</h3>
|
| | <p class="card-text text-muted mb-4">
|
| | 实时交互式终端，支持命令执行、进程管理。提供完整的Shell体验。
|
| | </p>
|
| | <ul class="list-unstyled text-start mb-4">
|
| | <li><i class="fas fa-check text-success me-2"></i>实时终端交互</li>
|
| | <li><i class="fas fa-check text-success me-2"></i>命令历史记录</li>
|
| | <li><i class="fas fa-check text-success me-2"></i>多终端会话</li>
|
| | <li><i class="fas fa-check text-success me-2"></i>窗口大小调整</li>
|
| | </ul>
|
| | <a href="/terminal" class="btn btn-custom">
|
| | <i class="fas fa-terminal me-2"></i>进入终端
|
| | </a>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| |
|
| |
|
| | <div class="row mt-5">
|
| | <div class="col-12">
|
| | <div class="card">
|
| | <div class="card-body text-center">
|
| | <h5 class="card-title mb-3">
|
| | <i class="fas fa-info-circle me-2"></i>系统信息
|
| | </h5>
|
| | <div class="row text-center">
|
| | <div class="col-md-3">
|
| | <i class="fas fa-server text-primary mb-2" style="font-size: 2rem;"></i>
|
| | <p class="mb-0"><strong>服务器</strong></p>
|
| | <small class="text-muted">Flask + SocketIO</small>
|
| | </div>
|
| | <div class="col-md-3">
|
| | <i class="fas fa-shield-alt text-success mb-2" style="font-size: 2rem;"></i>
|
| | <p class="mb-0"><strong>安全</strong></p>
|
| | <small class="text-muted">Token 认证</small>
|
| | </div>
|
| | <div class="col-md-3">
|
| | <i class="fas fa-bolt text-warning mb-2" style="font-size: 2rem;"></i>
|
| | <p class="mb-0"><strong>性能</strong></p>
|
| | <small class="text-muted">实时响应</small>
|
| | </div>
|
| | <div class="col-md-3">
|
| | <i class="fas fa-mobile-alt text-info mb-2" style="font-size: 2rem;"></i>
|
| | <p class="mb-0"><strong>兼容</strong></p>
|
| | <small class="text-muted">移动端适配</small>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| | </div>
|
| |
|
| | <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
|
| | </body>
|
| | </html> |
