Update index.html

This commit is contained in:
公明 2025-04-22 18:09:56 +08:00 committed by GitHub
parent 01f4a51dcb
commit d26366abd8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -4,9 +4,9 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PrivHunterAI</title>
<!-- 引入 Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
<!-- 引入 Font Awesome 图标库 -->
<!-- 由于网络原因Bootstrap 和 Font Awesome 的 CDN 链接可能无法正常加载 -->
<!-- 如果需要使用这些资源,建议检查网络连接或使用其他可靠的 CDN 链接 -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<style>
body {
@ -24,17 +24,6 @@
overflow: hidden;
}
.header::after {
content: "";
position: absolute;
bottom: -50px;
right: -50px;
width: 300px;
height: 300px;
background: rgba(255,255,255,0.1);
border-radius: 50%;
}
.header h1 {
font-size: 2.5rem;
font-weight: bold;
@ -169,16 +158,16 @@
.data-table th {
padding: 1.5rem;
text-align: center;
vertical-align: middle;
max-width: 150px;
vertical-align: middle;
word-wrap: break-word;
border-bottom: 0.1rem solid #e0e0e0;
}
.data-table td {
padding: 1.5rem;
text-align: center;
vertical-align: middle;
max-width: 150px;
vertical-align: middle;
word-wrap: break-word;
border-bottom: 0.1rem solid #e0e0e0;
}
@ -236,6 +225,22 @@
border-radius: 5px;
border: 1px solid #ddd;
}
/* 展开详情样式 */
.details-expander {
cursor: pointer;
color: #4a90e2;
}
.details-panel {
display: none;
background-color: #f8f9fa;
padding: 15px;
border-radius: 5px;
margin-top: 10px;
}
.details-panel.active {
display: block;
}
</style>
</head>
<body>
@ -293,12 +298,10 @@
<tr>
<th>Method</th>
<th>URL</th>
<th>Reqbody</th>
<th>RespBodyA</th>
<th>RespBodyB</th>
<th>Result</th>
<th>Reason</th>
<th>Confidence</th>
<th>操作</th>
</tr>
</thead>
<tbody id="data-body">
@ -384,7 +387,7 @@
if (paginatedData.length === 0) {
const emptyRow = document.createElement('tr');
emptyRow.innerHTML = `
<td colspan="8" class="empty-state">
<td colspan="6" class="empty-state">
<i class="fas fa-search"></i>
<p>没有找到符合条件的数据</p>
</td>
@ -409,12 +412,19 @@
row.innerHTML = `
<td>${item.method || '-'}</td>
<td>${item.url || '-'}</td>
<td>${item.reqbody || '-'}</td>
<td>${item.respBodyA || '-'}</td>
<td>${item.respBodyB || '-'}</td>
<td>${item.result === 'unknown' ? '未知' : item.result=== 'false' ? '安全' : '漏洞'}</td>
<td>${item.result === 'unknown' ? '未知' : item.result === 'false' ? '安全' : '漏洞'}</td>
<td>${item.reason || '-'}</td>
<td>${item.confidence || '-'}</td>
<td>
<div class="details-expander" onclick="toggleDetails(this)">
<i class="fas fa-chevron-down"></i> 展开详情
</div>
<div class="details-panel">
<strong>请求体:</strong>${item.reqbody || '-'}<br>
<strong>响应体A</strong>${item.respBodyA || '-'}<br>
<strong>响应体B</strong>${item.respBodyB || '-'}
</div>
</td>
`;
tableBody.appendChild(row);
});
@ -482,6 +492,18 @@
updatePagination();
}
// 切换详情面板的显示状态
function toggleDetails(element) {
const panel = element.nextElementSibling;
if (panel.classList.contains('active')) {
panel.classList.remove('active');
element.innerHTML = '<i class="fas fa-chevron-down"></i> 展开详情';
} else {
panel.classList.add('active');
element.innerHTML = '<i class="fas fa-chevron-up"></i> 收起详情';
}
}
// 初始化时尝试获取数据
document.addEventListener('DOMContentLoaded', () => {
fetchData();