mirror of
https://github.com/Ed1s0nZ/CyberStrikeAI.git
synced 2026-04-01 08:40:42 +02:00
162 lines
8.4 KiB
HTML
162 lines
8.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>CyberStrikeAI - 自主渗透测试平台</title>
|
||
<link rel="stylesheet" href="/static/css/style.css">
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<div class="header-content">
|
||
<div class="logo">
|
||
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<path d="M12 2L2 7L12 12L22 7L12 2Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||
<path d="M2 17L12 22L22 17" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||
<path d="M2 12L12 17L22 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||
</svg>
|
||
<h1>CyberStrike</h1>
|
||
</div>
|
||
<div class="header-right">
|
||
<p class="header-subtitle">安全测试平台</p>
|
||
<button class="settings-btn" onclick="openSettings()" title="设置">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<path d="M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||
<path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="main-layout">
|
||
<!-- 历史对话侧边栏 -->
|
||
<aside class="sidebar">
|
||
<div class="sidebar-header">
|
||
<button class="new-chat-btn" onclick="startNewConversation()">
|
||
<span>+</span> 新对话
|
||
</button>
|
||
</div>
|
||
<div class="sidebar-content">
|
||
<div class="sidebar-title">历史对话</div>
|
||
<div id="conversations-list" class="conversations-list"></div>
|
||
</div>
|
||
</aside>
|
||
|
||
<!-- 对话界面 -->
|
||
<div class="chat-container">
|
||
<div id="active-tasks-bar" class="active-tasks-bar"></div>
|
||
<div id="chat-messages" class="chat-messages"></div>
|
||
<div class="chat-input-container">
|
||
<textarea id="chat-input" placeholder="输入测试目标或命令... (Shift+Enter 换行，Enter 发送)" rows="1"></textarea>
|
||
<button onclick="sendMessage()">发送</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 设置模态框 -->
|
||
<div id="settings-modal" class="modal">
|
||
<div class="modal-content settings-modal-content">
|
||
<div class="modal-header">
|
||
<h2>系统设置</h2>
|
||
<span class="modal-close" onclick="closeSettings()">×</span>
|
||
</div>
|
||
<div class="modal-body settings-body">
|
||
<!-- OpenAI配置 -->
|
||
<div class="settings-section">
|
||
<h3>OpenAI 配置</h3>
|
||
<div class="settings-form">
|
||
<div class="form-group">
|
||
<label for="openai-api-key">API Key <span style="color: red;">*</span></label>
|
||
<input type="password" id="openai-api-key" placeholder="输入OpenAI API Key" required />
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="openai-base-url">Base URL <span style="color: red;">*</span></label>
|
||
<input type="text" id="openai-base-url" placeholder="https://api.openai.com/v1" required />
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="openai-model">模型 <span style="color: red;">*</span></label>
|
||
<input type="text" id="openai-model" placeholder="gpt-4" required />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- MCP工具配置 -->
|
||
<div class="settings-section">
|
||
<h3>MCP 工具配置</h3>
|
||
<div class="tools-controls">
|
||
<div class="tools-actions">
|
||
<button class="btn-secondary" onclick="selectAllTools()">全选</button>
|
||
<button class="btn-secondary" onclick="deselectAllTools()">全不选</button>
|
||
<input type="text" id="tools-search" placeholder="搜索工具..." oninput="filterTools()" />
|
||
</div>
|
||
<div id="tools-list" class="tools-list"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Agent配置 -->
|
||
<div class="settings-section">
|
||
<h3>Agent 配置</h3>
|
||
<div class="settings-form">
|
||
<div class="form-group">
|
||
<label for="agent-max-iterations">最大迭代次数</label>
|
||
<input type="number" id="agent-max-iterations" min="1" max="100" placeholder="30" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button class="btn-secondary" onclick="closeSettings()">取消</button>
|
||
<button class="btn-primary" onclick="applySettings()">应用配置</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- MCP调用详情模态框 -->
|
||
<div id="mcp-detail-modal" class="modal">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h2>工具调用详情</h2>
|
||
<span class="modal-close" onclick="closeMCPDetail()">×</span>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="detail-section">
|
||
<h3>执行信息</h3>
|
||
<div class="detail-item">
|
||
<strong>工具:</strong> <span id="detail-tool-name"></span>
|
||
</div>
|
||
<div class="detail-item">
|
||
<strong>状态:</strong> <span id="detail-status"></span>
|
||
</div>
|
||
<div class="detail-item">
|
||
<strong>时间:</strong> <span id="detail-time"></span>
|
||
</div>
|
||
<div class="detail-item">
|
||
<strong>ID:</strong> <span id="detail-execution-id" style="font-family: monospace; font-size: 0.8125rem; color: var(--text-secondary);"></span>
|
||
</div>
|
||
</div>
|
||
<div class="detail-section">
|
||
<h3>请求参数</h3>
|
||
<pre id="detail-request" class="code-block"></pre>
|
||
</div>
|
||
<div class="detail-section">
|
||
<h3>响应结果</h3>
|
||
<pre id="detail-response" class="code-block"></pre>
|
||
</div>
|
||
<div class="detail-section" id="detail-error-section" style="display: none;">
|
||
<h3>错误信息</h3>
|
||
<pre id="detail-error" class="code-block error"></pre>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Marked.js for Markdown parsing -->
|
||
<script src="https://cdn.jsdelivr.net/npm/marked@11.1.1/marked.min.js"></script>
|
||
<script src="/static/js/app.js"></script>
|
||
</body>
|
||
</html>
|
||
|