410 lines
24 KiB
HTML
410 lines
24 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title id="pageTitle" data-i18n="sve_list_title">SVE漏洞列表 - SVE Database</title>
|
||
<script src="https://tailwind.gvsds.com"></script>
|
||
<link href="https://cdn.gvsds.com/font-awesome/css/all.min.css" rel="stylesheet" media="print" onload="this.media='all'">
|
||
<script src="https://cdn.gvsds.com/Chart.js/dist/chart.umd.js"></script>
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'">
|
||
|
||
<!-- Tailwind配置 -->
|
||
<script>
|
||
tailwind.config = {
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
primary: '#0F3460',
|
||
secondary: '#1A73E8',
|
||
danger: '#D93025',
|
||
warning: '#F4B400',
|
||
success: '#1E8E3E',
|
||
neutral: '#5F6368',
|
||
light: '#F8F9FA',
|
||
dark: '#202124'
|
||
},
|
||
fontFamily: {
|
||
inter: ['Inter', 'sans-serif'],
|
||
},
|
||
animation: {
|
||
'fade-in': 'fadeIn 0.3s ease-in-out',
|
||
'slide-up': 'slideUp 0.4s ease-out',
|
||
},
|
||
keyframes: {
|
||
fadeIn: {
|
||
'0%': { opacity: '0' },
|
||
'100%': { opacity: '1' },
|
||
},
|
||
slideUp: {
|
||
'0%': { transform: 'translateY(10px)', opacity: '0' },
|
||
'100%': { transform: 'translateY(0)', opacity: '1' },
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style type="text/tailwindcss">
|
||
@layer utilities {
|
||
.content-auto {
|
||
content-visibility: auto;
|
||
}
|
||
.shadow-soft {
|
||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
|
||
}
|
||
.shadow-hover {
|
||
transition: all 0.3s ease;
|
||
}
|
||
.shadow-hover:hover {
|
||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.12);
|
||
transform: translateY(-2px);
|
||
}
|
||
.severity-badge {
|
||
@apply px-2 py-1 rounded-full text-xs font-medium;
|
||
}
|
||
.filter-card {
|
||
@apply bg-white rounded-lg shadow-soft p-4 mb-4 animate-fade-in;
|
||
}
|
||
.lang-switch-btn {
|
||
padding: 2px 8px;
|
||
border-radius: 4px;
|
||
transition: all 0.2s;
|
||
}
|
||
.lang-switch-btn.active {
|
||
background-color: #1A73E8;
|
||
color: white;
|
||
font-weight: 500;
|
||
}
|
||
.lang-switch-btn.inactive {
|
||
background-color: #F8F9FA;
|
||
color: #5F6368;
|
||
}
|
||
.lang-switch-btn.inactive:hover {
|
||
background-color: #E8F0FE;
|
||
color: #1A73E8;
|
||
}
|
||
.pagination-btn {
|
||
@apply px-3 py-1.5 rounded-md border border-gray-300 text-neutral hover:bg-light transition-colors;
|
||
}
|
||
.pagination-btn.active {
|
||
@apply bg-secondary text-white border-secondary;
|
||
}
|
||
.input-focus {
|
||
@apply focus:outline-none focus:ring-2 focus:ring-secondary/50 focus:border-secondary;
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="font-inter bg-gray-50 text-dark">
|
||
<!-- 顶部导航栏 -->
|
||
<header class="bg-white shadow-sm sticky top-0 z-50 transition-all duration-300">
|
||
<div class="container mx-auto px-4 sm:px-6 lg:px-8">
|
||
<div class="flex justify-between items-center py-4">
|
||
<div class="flex items-center space-x-2">
|
||
<i class="fa fa-shield text-primary text-2xl"></i>
|
||
<span class="text-xl font-bold text-primary" data-i18n="sve_database">SVE Database</span>
|
||
</div>
|
||
|
||
<!-- 桌面端语言切换按钮组 -->
|
||
<div class="hidden md:flex items-center space-x-2 mr-4">
|
||
<button id="lang-en" class="lang-switch-btn active">English</button>
|
||
<button id="lang-zh" class="lang-switch-btn inactive">中文</button>
|
||
</div>
|
||
|
||
<nav class="hidden md:flex items-center space-x-8">
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="home">Home</a>
|
||
<a href="#" class="text-primary font-medium hover:text-secondary transition-colors" data-i18n="browse">Browse</a>
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="search">Search</a>
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="about">About</a>
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="documentation">Documentation</a>
|
||
</nav>
|
||
|
||
<div class="flex items-center space-x-4">
|
||
<!-- 移动端语言切换 -->
|
||
<div class="hidden sm:flex items-center space-x-2 mr-2" id="mobile-lang-switch">
|
||
<button id="mobile-lang-en" class="lang-switch-btn active text-xs">EN</button>
|
||
<button id="mobile-lang-zh" class="lang-switch-btn inactive text-xs">中文</button>
|
||
</div>
|
||
|
||
<div class="relative hidden md:block">
|
||
<input type="text" placeholder="Search SVE..." class="pl-10 pr-4 py-2 rounded-lg border border-gray-300 input-focus w-64 transition-all" data-i18n-placeholder="search_sve_placeholder">
|
||
<i class="fa fa-search absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
|
||
</div>
|
||
<button class="md:hidden text-neutral hover:text-primary">
|
||
<i class="fa fa-search text-xl"></i>
|
||
</button>
|
||
<button class="md:hidden text-neutral hover:text-primary" id="mobile-menu-btn">
|
||
<i class="fa fa-bars text-xl"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 移动端导航菜单 -->
|
||
<div class="md:hidden hidden bg-white border-t border-gray-100 py-3" id="mobile-menu">
|
||
<nav class="flex flex-col space-y-3 px-2">
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors py-2 px-3 rounded" data-i18n="home">Home</a>
|
||
<a href="#" class="text-primary font-medium hover:text-secondary transition-colors py-2 px-3 rounded" data-i18n="browse">Browse</a>
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors py-2 px-3 rounded" data-i18n="search">Search</a>
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors py-2 px-3 rounded" data-i18n="about">About</a>
|
||
<a href="#" class="text-neutral hover:text-secondary transition-colors py-2 px-3 rounded" data-i18n="documentation">Documentation</a>
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- 主内容区 -->
|
||
<main class="container mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||
<!-- 页面标题与统计 -->
|
||
<div class="mb-8 animate-slide-up">
|
||
<h1 class="text-2xl md:text-3xl font-bold text-primary mb-2" data-i18n="sve_list_title">SVE漏洞列表</h1>
|
||
<p class="text-neutral" data-i18n="sve_list_desc">
|
||
展示所有已公开的SVE漏洞信息，支持多维度筛选和分页查询
|
||
</p>
|
||
<div class="flex flex-wrap items-center gap-4 mt-4 text-sm">
|
||
<span class="text-neutral" data-i18n="total_vulns">总漏洞数：</span>
|
||
<span class="font-semibold text-primary" id="totalVulns">0</span>
|
||
<span class="text-neutral ml-4" data-i18n="current_page">当前页：</span>
|
||
<span class="font-semibold text-primary" id="currentPageInfo">1 / 0</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 筛选区域 -->
|
||
<div class="mb-8 animate-fade-in">
|
||
<button id="toggleFilterBtn" class="flex items-center text-secondary hover:text-primary transition-colors mb-4">
|
||
<i class="fa fa-filter mr-2"></i>
|
||
<span data-i18n="advanced_filter">高级筛选</span>
|
||
<i class="fa fa-chevron-down ml-2 transition-transform duration-300" id="filterChevron"></i>
|
||
</button>
|
||
|
||
<!-- 筛选面板 -->
|
||
<div id="filterPanel" class="hidden bg-white rounded-xl shadow-soft p-6 mb-6">
|
||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||
<!-- 1. 标题搜索 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="filter_title">漏洞标题</label>
|
||
<div class="relative">
|
||
<input type="text" id="filterTitle" placeholder="输入关键词搜索"
|
||
class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm"
|
||
data-i18n-placeholder="filter_title_placeholder">
|
||
<i class="fa fa-search absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 2. CVSS严重级别筛选 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="filter_cvss_severity">CVSS严重级别</label>
|
||
<select id="filterCvssSeverity" class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm">
|
||
<option value="" data-i18n="filter_all">全部</option>
|
||
<option value="CRITICAL" data-i18n="critical">严重（CRITICAL）</option>
|
||
<option value="HIGH" data-i18n="high">高危（HIGH）</option>
|
||
<option value="MEDIUM" data-i18n="medium">中等（MEDIUM）</option>
|
||
<option value="LOW" data-i18n="low">低危（LOW）</option>
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 3. 发布年份筛选 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="filter_publish_year">发布年份</label>
|
||
<select id="filterPublishYear" class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm">
|
||
<option value="" data-i18n="filter_all">全部</option>
|
||
<!-- 动态生成近5年选项 -->
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 4. 每页条数 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="filter_page_size">每页条数</label>
|
||
<select id="filterPageSize" class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm">
|
||
<option value="10">10 条/页</option>
|
||
<option value="20">20 条/页</option>
|
||
<option value="50">50 条/页</option>
|
||
<option value="100">100 条/页</option>
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 5. CVSS具体参数：攻击向量 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="attack_vector">攻击向量（AV）</label>
|
||
<select id="filterCvssAv" class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm">
|
||
<option value="" data-i18n="filter_all">全部</option>
|
||
<option value="N" data-i18n="av_network">网络（N）</option>
|
||
<option value="A" data-i18n="av_adjacent">相邻网络（A）</option>
|
||
<option value="L" data-i18n="av_local">本地（L）</option>
|
||
<option value="P" data-i18n="av_physical">物理（P）</option>
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 6. CVSS具体参数：攻击复杂度 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="attack_complexity">攻击复杂度（AC）</label>
|
||
<select id="filterCvssAc" class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm">
|
||
<option value="" data-i18n="filter_all">全部</option>
|
||
<option value="L" data-i18n="ac_low">低（L）</option>
|
||
<option value="H" data-i18n="ac_high">高（H）</option>
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 7. CVSS具体参数：所需权限 -->
|
||
<div class="filter-card">
|
||
<label class="block text-sm font-medium text-neutral mb-2" data-i18n="privileges_required">所需权限（PR）</label>
|
||
<select id="filterCvssPr" class="w-full px-4 py-2 rounded-lg border border-gray-300 input-focus text-sm">
|
||
<option value="" data-i18n="filter_all">全部</option>
|
||
<option value="N" data-i18n="pr_none">无（N）</option>
|
||
<option value="L" data-i18n="pr_low">低（L）</option>
|
||
<option value="H" data-i18n="pr_high">高（H）</option>
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 8. 筛选按钮 -->
|
||
<div class="filter-card flex items-end">
|
||
<button id="applyFilterBtn" class="w-full bg-secondary hover:bg-secondary/90 text-white font-medium py-2 px-4 rounded-lg transition-colors text-sm" data-i18n="apply_filter">
|
||
应用筛选
|
||
</button>
|
||
<button id="resetFilterBtn" class="w-full mt-2 text-neutral hover:text-danger transition-colors text-sm" data-i18n="reset_filter">
|
||
重置筛选
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 漏洞列表区域 -->
|
||
<div class="bg-white rounded-xl shadow-soft overflow-hidden animate-fade-in">
|
||
<!-- 列表表头 -->
|
||
<div class="hidden md:grid grid-cols-12 bg-gray-50 py-3 px-6 border-b border-gray-200 font-medium text-sm">
|
||
<div class="col-span-2" data-i18n="sve_id">SVE ID</div>
|
||
<div class="col-span-4" data-i18n="vuln_title">漏洞标题</div>
|
||
<div class="col-span-2" data-i18n="cvss_score">CVSS评分</div>
|
||
<div class="col-span-2" data-i18n="severity">严重级别</div>
|
||
<div class="col-span-2" data-i18n="publish_date">发布日期</div>
|
||
<div class="col-span-2" data-i18n="actions">操作</div>
|
||
</div>
|
||
|
||
<!-- 列表内容 -->
|
||
<div id="vulnList" class="divide-y divide-gray-200">
|
||
<!-- 加载状态 -->
|
||
<div id="loadingIndicator" class="py-12 text-center">
|
||
<div class="inline-block animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-secondary mb-4"></div>
|
||
<p class="text-neutral" data-i18n="loading_data">加载数据中...</p>
|
||
</div>
|
||
|
||
<!-- 空状态 -->
|
||
<div id="emptyState" class="py-16 text-center hidden">
|
||
<i class="fa fa-search text-4xl text-gray-300 mb-4"></i>
|
||
<p class="text-neutral" data-i18n="no_results">未找到符合条件的漏洞</p>
|
||
<button id="emptyResetBtn" class="mt-4 text-secondary hover:text-primary transition-colors text-sm" data-i18n="reset_filters">
|
||
重置筛选条件
|
||
</button>
|
||
</div>
|
||
|
||
<!-- 错误状态 -->
|
||
<div id="errorState" class="py-16 text-center hidden">
|
||
<i class="fa fa-exclamation-circle text-4xl text-danger mb-4"></i>
|
||
<p class="text-neutral" data-i18n="load_error">数据加载失败</p>
|
||
<button id="retryBtn" class="mt-4 bg-secondary hover:bg-secondary/90 text-white font-medium py-2 px-4 rounded-lg transition-colors text-sm" data-i18n="retry">
|
||
重试
|
||
</button>
|
||
</div>
|
||
|
||
<!-- 漏洞列表项将动态插入这里 -->
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 分页控件 -->
|
||
<div class="mt-8 flex flex-col sm:flex-row justify-between items-center gap-4 animate-fade-in">
|
||
<div class="text-sm text-neutral" data-i18n="showing_results">
|
||
<span id="showingFrom">1</span> - <span id="showingTo">10</span> 条，共 <span id="totalResults">0</span> 条
|
||
</div>
|
||
<div class="flex items-center gap-2">
|
||
<button id="prevPageBtn" class="pagination-btn" disabled>
|
||
<i class="fa fa-chevron-left"></i>
|
||
</button>
|
||
<div id="paginationNumbers" class="flex items-center gap-1">
|
||
<!-- 页码将动态生成 -->
|
||
</div>
|
||
<button id="nextPageBtn" class="pagination-btn" disabled>
|
||
<i class="fa fa-chevron-right"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
|
||
<!-- 页脚 -->
|
||
<footer class="bg-white py-12 mt-12">
|
||
<div class="container mx-auto px-4 sm:px-6 lg:px-8">
|
||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
||
<div>
|
||
<div class="flex items-center space-x-2 mb-4">
|
||
<i class="fa fa-shield text-primary text-xl"></i>
|
||
<span class="text-lg font-bold text-primary" data-i18n="sve_database">SVE Database</span>
|
||
</div>
|
||
<p class="text-sm text-neutral mb-4" data-i18n="footer_desc">A comprehensive database of security vulnerabilities and exposures, maintained by the Security Research Team.</p>
|
||
<div class="flex space-x-4">
|
||
<a href="#" class="text-neutral hover:text-primary transition-colors">
|
||
<i class="fa-brands fa-twitter"></i>
|
||
</a>
|
||
<a href="https://www.gvsds.com/GVSDS/" class="text-neutral hover:text-primary transition-colors">
|
||
<i class="fa-brands fa-github"></i>
|
||
</a>
|
||
<a href="#" class="text-neutral hover:text-primary transition-colors">
|
||
<i class="fa-brands fa-linkedin"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="font-semibold text-dark mb-4" data-i18n="footer_resources">Resources</h4>
|
||
<ul class="space-y-2 text-sm">
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="documentation">Documentation</a></li>
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="api">API</a></li>
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="bulk_data">Bulk Data</a></li>
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="statistics">Statistics</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="font-semibold text-dark mb-4" data-i18n="footer_information">Information</h4>
|
||
<ul class="space-y-2 text-sm">
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="about_sve">About SVE</a></li>
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="cve_compatibility">CVE Compatibility</a></li>
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="vuln_metrics">Vulnerability Metrics</a></li>
|
||
<li><a href="#" class="text-neutral hover:text-secondary transition-colors" data-i18n="faq">FAQ</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="font-semibold text-dark mb-4" data-i18n="footer_contact">Contact</h4>
|
||
<ul class="space-y-2 text-sm">
|
||
<li class="flex items-start">
|
||
<i class="fa fa-envelope text-secondary mt-1 mr-2"></i>
|
||
<a href="mailto:sve@gvsds.com" class="text-neutral hover:text-secondary transition-colors">sve@gvsds.com</a>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fa fa-file-text text-secondary mt-1 mr-2"></i>
|
||
<a href="mailto:sve@gvsds.org?subject=[WARNING]%20Report%20A%20Vulnerability%20!" class="text-neutral hover:text-secondary transition-colors" data-i18n="report_vuln">Report a Vulnerability</a>
|
||
</li>
|
||
<li class="flex items-start">
|
||
<i class="fa fa-info-circle text-secondary mt-1 mr-2"></i>
|
||
<a href="https://doc.gvsds.com/6e845a45fc493c66a23a9361bce1464d" class="text-neutral hover:text-secondary transition-colors" data-i18n="security_policy" target="_blank">Security Policy</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="border-t border-gray-200 mt-8 pt-6 flex flex-col md:flex-row justify-between items-center">
|
||
<p class="text-sm text-neutral" data-i18n="copyright">© 2025 SVE Database. All rights reserved.</p>
|
||
<div class="flex space-x-6 mt-4 md:mt-0 text-sm">
|
||
<a href="https://doc.gvsds.com/fc084ab20a283208adb19033ca4de173" target="_blank" class="text-neutral hover:text-secondary transition-colors" data-i18n="privacy_policy">Privacy Policy</a>
|
||
<a href="https://doc.gvsds.com/1f07d3b8cec43a2ab9892a15b150bdd6" target="_blank" class="text-neutral hover:text-secondary transition-colors" data-i18n="terms_service">Terms of Service</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="/assets/js/i18n.js"></script>
|
||
<script src="/assets/js/query.js"></script>
|
||
</body>
|
||
</html>
|