Files
vf_react/public/htmls/光纤列阵单元FAU.html
2025-10-11 16:16:02 +08:00

490 lines
21 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>光纤列阵单元FAU - 概念分析</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<style>
:root {
--primary-color: #0d6efd;
--secondary-color: #6c757d;
--success-color: #198754;
--info-color: #0dcaf0;
--warning-color: #ffc107;
--danger-color: #dc3545;
--light-bg: #f8f9fa;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
background-color: var(--light-bg);
color: #333;
}
.hero-section {
background: linear-gradient(135deg, #0d6efd 0%, #6610f2 100%);
color: white;
padding: 3rem 0;
margin-bottom: 2rem;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.card {
border: none;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
transition: transform 0.3s ease, box-shadow 0.3s ease;
margin-bottom: 1.5rem;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 16px rgba(0,0,0,0.12);
}
.card-header {
background-color: white;
border-bottom: 2px solid #e9ecef;
font-weight: 600;
color: var(--primary-color);
}
.badge-custom {
font-size: 0.85rem;
padding: 0.4rem 0.8rem;
border-radius: 20px;
}
.table-responsive {
overflow-x: visible !important;
}
.table {
border-collapse: separate;
border-spacing: 0;
}
.table thead th {
background-color: var(--primary-color);
color: white;
font-weight: 600;
border: none;
position: sticky;
top: 0;
z-index: 10;
}
.table tbody tr {
transition: background-color 0.2s ease;
}
.table tbody tr:hover {
background-color: rgba(13, 110, 253, 0.05);
}
.table td, .table th {
padding: 1rem;
vertical-align: middle;
border-bottom: 1px solid #e9ecef;
}
.timeline {
position: relative;
padding: 20px 0;
}
.timeline::before {
content: '';
position: absolute;
top: 0;
left: 50%;
width: 2px;
height: 100%;
background: var(--primary-color);
transform: translateX(-50%);
}
.timeline-item {
position: relative;
margin-bottom: 30px;
}
.timeline-item::before {
content: '';
position: absolute;
top: 0;
left: 50%;
width: 16px;
height: 16px;
border-radius: 50%;
background: var(--primary-color);
transform: translateX(-50%);
border: 3px solid white;
box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.2);
}
.timeline-content {
width: 45%;
padding: 15px;
background: white;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.timeline-item:nth-child(odd) .timeline-content {
margin-left: auto;
}
.timeline-item:nth-child(even) .timeline-content {
margin-right: auto;
}
.highlight-box {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 2rem;
border-radius: 12px;
margin-bottom: 2rem;
}
.industry-tag {
display: inline-block;
padding: 0.25rem 0.75rem;
background-color: rgba(13, 110, 253, 0.1);
color: var(--primary-color);
border-radius: 20px;
font-size: 0.875rem;
margin-right: 0.5rem;
margin-bottom: 0.5rem;
}
@media (max-width: 768px) {
.hero-section {
padding: 2rem 0;
}
.timeline::before {
left: 20px;
}
.timeline-item::before {
left: 20px;
}
.timeline-content {
width: calc(100% - 50px);
margin-left: 50px !important;
}
.table {
font-size: 0.875rem;
}
.table td, .table th {
padding: 0.5rem;
}
}
</style>
</head>
<body>
<!-- Hero Section -->
<div class="hero-section">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-8">
<h1 class="display-4 fw-bold mb-3">光纤列阵单元FAU</h1>
<p class="lead mb-0">CPO交换机的核心组件AI算力时代的光互连关键基础设施</p>
</div>
<div class="col-lg-4 text-lg-end mt-3 mt-lg-0">
<span class="badge bg-light text-dark fs-6 me-2">概念代码: 250729</span>
<span class="badge bg-warning text-dark fs-6">高速成长期</span>
</div>
</div>
</div>
</div>
<div class="container">
<!-- 核心观点摘要 -->
<div class="highlight-box">
<h2 class="h3 mb-3"><i class="bi bi-lightbulb-fill me-2"></i>核心观点摘要</h2>
<p class="mb-2">FAU当前处于技术验证向规模化量产过渡阶段核心驱动力是AI算力需求推动的数据中心光模块升级以及CPO技术对高速、低功耗光互连的需求。</p>
<p class="mb-0">未来潜力在于CPO技术的普及将推动FAU需求爆发成为光模块产业链中不可或缺的核心组件。</p>
</div>
<!-- 核心逻辑与市场认知分析 -->
<div class="row">
<div class="col-lg-4 mb-4">
<div class="card h-100">
<div class="card-header">
<h5 class="mb-0"><i class="bi bi-rocket-takeoff me-2"></i>核心驱动力</h5>
</div>
<div class="card-body">
<ul class="list-unstyled">
<li class="mb-3">
<i class="bi bi-check-circle-fill text-success me-2"></i>
<strong>AI算力需求爆发</strong>
<p class="small text-muted mb-0">大模型训练推动数据中心光模块从400G向800G、1.6T升级</p>
</li>
<li class="mb-3">
<i class="bi bi-check-circle-fill text-success me-2"></i>
<strong>CPO技术普及</strong>
<p class="small text-muted mb-0">光引擎与交换机芯片共封装,降低功耗和成本</p>
</li>
<li>
<i class="bi bi-check-circle-fill text-success me-2"></i>
<strong>光引擎技术升级</strong>
<p class="small text-muted mb-0">硅光技术实现低成本、高集成度光互连</p>
</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<div class="card-header">
<h5 class="mb-0"><i class="bi bi-fire me-2"></i>市场热度与情绪</h5>
</div>
<div class="card-body">
<div class="mb-3">
<span class="badge bg-danger badge-custom me-2">高热度</span>
<span class="badge bg-warning text-dark badge-custom">乐观预期</span>
</div>
<p class="small">多份研报将FAU列为CPO光互联的关键环节重点分析了相关厂商的布局进展。</p>
<div class="progress mt-3" style="height: 10px;">
<div class="progress-bar bg-danger" role="progressbar" style="width: 85%"></div>
</div>
<p class="small text-muted mt-2 mb-0">市场热度指数: 85%</p>
</div>
</div>
</div>
<div class="col-lg-4 mb-4">
<div class="card h-100">
<div class="card-header">
<h5 class="mb-0"><i class="bi bi-exclamation-triangle me-2"></i>预期差分析</h5>
</div>
<div class="card-body">
<ul class="list-unstyled">
<li class="mb-2">
<i class="bi bi-arrow-down-circle text-danger me-2"></i>
<span class="small">技术壁垒可能低于预期</span>
</li>
<li class="mb-2">
<i class="bi bi-arrow-down-circle text-danger me-2"></i>
<span class="small">规模化量产进度或滞后</span>
</li>
<li>
<i class="bi bi-arrow-down-circle text-danger me-2"></i>
<span class="small">CPO技术商业化节奏不确定</span>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- 关键催化剂与未来发展路径 -->
<div class="card mb-4">
<div class="card-header">
<h5 class="mb-0"><i class="bi bi-graph-up-arrow me-2"></i>关键催化剂与未来发展路径</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<h6 class="text-primary mb-3">近期催化剂3-6个月</h6>
<div class="timeline">
<div class="timeline-item">
<div class="timeline-content">
<h6 class="mb-1">英伟达GTC大会技术落地</h6>
<p class="small text-muted mb-0">2025年3月发布CPO交换机技术路线验证结果</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-content">
<h6 class="mb-1">天孚通信/光库科技订单兑现</h6>
<p class="small text-muted mb-0">FAU产品进入小批量阶段产能快速释放</p>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<h6 class="text-primary mb-3">长期发展路径3-5年</h6>
<div class="mb-3">
<span class="industry-tag">高密度光纤阵列</span>
<span class="industry-tag">低损耗耦合技术</span>
<span class="industry-tag">自动化产线集成</span>
</div>
<p class="small text-muted">支持32通道、64通道升级插入损耗<0.1dB自动化产线提升良率</p>
</div>
</div>
</div>
</div>
<!-- 产业链与核心公司深度剖析 -->
<div class="card">
<div class="card-header">
<h5 class="mb-0"><i class="bi bi-diagram-3 me-2"></i>产业链与核心公司深度剖析</h5>
</div>
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-hover mb-0">
<thead>
<tr>
<th>股票名称</th>
<th>分类</th>
<th>项目</th>
<th>行业</th>
<th>产业链</th>
<th>信源</th>
<th>核心优势</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>天孚通信</strong><br><small class="text-muted">300308.SZ</small></td>
<td><span class="badge bg-primary">产品</span></td>
<td>FAU光纤阵列设计制造技术</td>
<td>光纤通信</td>
<td>光纤阵列制造</td>
<td><span class="badge bg-secondary">互动</span></td>
<td class="small">光器件龙头,技术积累深厚,与英伟达深度绑定</td>
</tr>
<tr>
<td><strong>杰普特</strong><br><small class="text-muted">-</small></td>
<td><span class="badge bg-primary">产品</span></td>
<td>MPO连接器组件业务</td>
<td>光通信</td>
<td>高密度光互联解决方案</td>
<td><span class="badge bg-secondary">互动</span></td>
<td class="small">进军FAU市场与MPO连接器组件业务形成技术协同</td>
</tr>
<tr>
<td><strong>光库科技</strong><br><small class="text-muted">300620.SZ</small></td>
<td><span class="badge bg-primary">产品</span></td>
<td>保偏光纤阵列和高密度光纤阵列产品</td>
<td>光纤器件</td>
<td>光纤阵列生产</td>
<td><span class="badge bg-secondary">互动</span></td>
<td class="small">通过收购加华微捷和安捷讯快速切入FAU供应链</td>
</tr>
<tr>
<td><strong>仕佳光子</strong><br><small class="text-muted">688313.SH</small></td>
<td><span class="badge bg-primary">产品</span></td>
<td>光纤阵列、保偏光纤产品</td>
<td>光通信</td>
<td>光纤器件制造</td>
<td><span class="badge bg-info">公告</span></td>
<td class="small">收购福可喜玛布局隔离器业务,保偏光纤实现国产替代</td>
</tr>
<tr>
<td><strong>汇绿生态</strong><br><small class="text-muted">-</small></td>
<td><span class="badge bg-primary">产品</span></td>
<td>收购钧恒科技49%股权</td>
<td>光通信</td>
<td>光纤阵列相关公司参股</td>
<td><span class="badge bg-info">公告/工商</span></td>
<td class="small">通过收购参股瑞芯光电(含光纤阵列业务)</td>
</tr>
<tr>
<td><strong>鸿日达</strong><br><small class="text-muted">001280.SZ</small></td>
<td><span class="badge bg-warning text-dark">设备</span></td>
<td>自研自动化FAU产线</td>
<td>光通信设备</td>
<td>FAU生产设备</td>
<td><span class="badge bg-danger">网传</span></td>
<td class="small">自研FAU产线设备良率提升至90%以上效率提升10倍</td>
</tr>
<tr>
<td><strong>罗博特科</strong><br><small class="text-muted">-</small></td>
<td><span class="badge bg-warning text-dark">设备</span></td>
<td>ficonTEC耦合设备及硅光芯片测试设备</td>
<td>半导体设备</td>
<td>光芯片测试设备</td>
<td><span class="badge bg-secondary">互动</span></td>
<td class="small">提供FAU耦合及硅光芯片测试设备</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- 投资建议 -->
<div class="card mt-4">
<div class="card-header">
<h5 class="mb-0"><i class="bi bi-clipboard-data me-2"></i>投资建议</h5>
</div>
<div class="card-body">
<div class="row align-items-center">
<div class="col-md-8">
<h6 class="text-primary mb-2">重点关注标的</h6>
<div class="d-flex flex-wrap">
<span class="badge bg-success me-2 mb-2">天孚通信</span>
<span class="badge bg-success me-2 mb-2">光库科技</span>
<span class="badge bg-success me-2 mb-2">仕佳光子</span>
<span class="badge bg-warning text-dark me-2 mb-2">鸿日达</span>
</div>
</div>
<div class="col-md-4 text-md-end mt-3 mt-md-0">
<div class="d-flex justify-content-md-end">
<div class="text-center me-4">
<h4 class="text-success mb-0">2025-2026</h4>
<small class="text-muted">60-70亿市场规模</small>
</div>
<div class="text-center">
<h4 class="text-success mb-0">2027</h4>
<small class="text-muted">100亿+市场规模</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<footer class="bg-dark text-white py-4 mt-5">
<div class="container">
<div class="row">
<div class="col-md-6">
<p class="mb-0">© 2025 光纤列阵单元FAU概念分析</p>
</div>
<div class="col-md-6 text-md-end">
<p class="mb-0">数据来源:公开信息整理 | 仅供参考,不构成投资建议</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
// 添加表格行点击效果
document.querySelectorAll('tbody tr').forEach(row => {
row.addEventListener('click', function() {
// 移除其他行的选中状态
document.querySelectorAll('tbody tr').forEach(r => {
r.classList.remove('table-active');
});
// 添加当前行的选中状态
this.classList.add('table-active');
});
});
// 平滑滚动
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
target.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
});
</script>
</body>
</html>