vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update ui

Browse Source
This commit is contained in:
zzlgreat
2025-11-13 17:38:54 +08:00
parent 0e32076e71
commit cb4c51a958
65 changed files with 39193 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

560
public/htmls/北美缺电AI电力.html Normal file
View File

@@ -0,0 +1,560 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>北美缺电AI电力 - 深度投资研究报告</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet">
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
* {
font-family: 'Inter', sans-serif;
}
.gradient-bg {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.glass-effect {
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.hover-scale {
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hover-scale:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.timeline-dot {
position: relative;
}
.timeline-dot::after {
content: '';
position: absolute;
width: 2px;
background: linear-gradient(180deg, #667eea 0%, transparent 100%);
top: 100%;
left: 50%;
transform: translateX(-50%);
height: 60px;
}
.timeline-item:last-child .timeline-dot::after {
display: none;
}
.risk-card {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}
.opportunity-card {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}
@keyframes float {
0% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
100% { transform: translateY(0px); }
}
.float-animation {
animation: float 3s ease-in-out infinite;
}
.table-container {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-container::-webkit-scrollbar {
height: 8px;
}
.table-container::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
.table-container::-webkit-scrollbar-thumb {
background: #888;
border-radius: 10px;
}
.badge-glow {
box-shadow: 0 0 20px rgba(79, 70, 229, 0.5);
}
</style>
</head>
<body class="bg-gray-50">
<!-- Hero Section -->
<header class="gradient-bg text-white py-20 px-4">
<div class="container mx-auto max-w-7xl">
<div class="flex flex-col md:flex-row items-center justify-between">
<div class="mb-8 md:mb-0 md:w-2/3">
<div class="inline-flex items-center bg-white/20 backdrop-blur-sm rounded-full px-4 py-2 mb-6">
<i class="fas fa-bolt mr-2 text-yellow-300"></i>
<span class="text-sm font-semibold">热点概念 · 2025年11月</span>
</div>
<h1 class="text-5xl md:text-6xl font-bold mb-6 leading-tight">
北美缺电<br>
<span class="text-transparent bg-clip-text bg-gradient-to-r from-yellow-300 to-pink-300">
AI电力革命
</span>
</h1>
<p class="text-xl mb-8 text-gray-100">
人工智能爆发式增长与电网老化瓶颈碰撞，催生全球电力设备出海黄金十年
</p>
<div class="flex flex-wrap gap-4">
<div class="flex items-center">
<i class="fas fa-chart-line mr-2 text-green-300"></i>
<span>市场热度: 极高</span>
</div>
<div class="flex items-center">
<i class="fas fa-clock mr-2 text-blue-300"></i>
<span>周期: 5-10年</span>
</div>
<div class="flex items-center">
<i class="fas fa-globe mr-2 text-purple-300"></i>
<span>影响: 全球供应链重塑</span>
</div>
</div>
</div>
<div class="md:w-1/3 float-animation">
<div class="glass-effect rounded-2xl p-8 text-center">
<i class="fas fa-microchip text-6xl mb-4 text-yellow-300"></i>
<h3 class="text-2xl font-bold mb-2">2030年预测</h3>
<div class="text-3xl font-bold text-yellow-300">200GW+</div>
<p class="text-sm mt-2">美国电力缺口</p>
<div class="text-xl mt-4 text-red-300">
<i class="fas fa-arrow-up"></i> 25%+
</div>
<p class="text-xs">占当前最大负荷</p>
</div>
</div>
</div>
</div>
</header>
<!-- Timeline Section -->
<section class="py-16 bg-white">
<div class="container mx-auto max-w-7xl px-4">
<h2 class="text-3xl font-bold text-center mb-12">
<i class="fas fa-timeline text-purple-600 mr-3"></i>
关键时间节点
</h2>
<div class="grid md:grid-cols-4 gap-8">
<div class="timeline-item text-center">
<div class="timeline-dot inline-block w-16 h-16 bg-gradient-to-br from-blue-500 to-purple-600 rounded-full flex items-center justify-center text-white font-bold mb-4">
2024
</div>
<h3 class="font-bold mb-2">背景发酵</h3>
<p class="text-sm text-gray-600">美国电力市场显露供应紧张</p>
</div>
<div class="timeline-item text-center">
<div class="timeline-dot inline-block w-16 h-16 bg-gradient-to-br from-purple-500 to-pink-600 rounded-full flex items-center justify-center text-white font-bold mb-4">
2025.01
</div>
<h3 class="font-bold mb-2">政策确认</h3>
<p class="text-sm text-gray-600">宣布国家能源紧急状态</p>
</div>
<div class="timeline-item text-center">
<div class="timeline-dot inline-block w-16 h-16 bg-gradient-to-br from-pink-500 to-red-600 rounded-full flex items-center justify-center text-white font-bold mb-4">
2025.11
</div>
<h3 class="font-bold mb-2">引爆点</h3>
<p class="text-sm text-gray-600">微软CEO确认，券商集中发布研报</p>
</div>
<div class="timeline-item text-center">
<div class="timeline-dot inline-block w-16 h-16 bg-gradient-to-br from-red-500 to-orange-600 rounded-full flex items-center justify-center text-white font-bold mb-4">
2026+
</div>
<h3 class="font-bold mb-2">兑现期</h3>
<p class="text-sm text-gray-600">订单落地，业绩释放</p>
</div>
</div>
</div>
</section>
<!-- Core Logic Section -->
<section class="py-16 bg-gray-100">
<div class="container mx-auto max-w-7xl px-4">
<h2 class="text-3xl font-bold text-center mb-12">
<i class="fas fa-brain text-indigo-600 mr-3"></i>
核心驱动逻辑
</h2>
<div class="grid md:grid-cols-3 gap-8">
<div class="bg-white rounded-2xl p-8 hover-scale shadow-lg">
<div class="text-4xl mb-4 text-red-500">
<i class="fas fa-rocket"></i>
</div>
<h3 class="text-xl font-bold mb-4">需求侧指数级冲击</h3>
<p class="text-gray-600 mb-4">
AI大模型训练带来算力需求指数增长，直接转化为数据中心巨大电力消耗
</p>
<div class="bg-red-50 rounded-lg p-4">
<div class="flex justify-between items-center">
<span class="font-semibold">2025年用电占比</span>
<span class="text-red-600 font-bold">个位数</span>
</div>
<div class="flex justify-between items-center mt-2">
<span class="font-semibold">2028年用电占比</span>
<span class="text-red-600 font-bold">~10%</span>
</div>
</div>
</div>
<div class="bg-white rounded-2xl p-8 hover-scale shadow-lg">
<div class="text-4xl mb-4 text-orange-500">
<i class="fas fa-exclamation-triangle"></i>
</div>
<h3 class="text-xl font-bold mb-4">供给侧结构性短板</h3>
<p class="text-gray-600 mb-4">
北美电网设备严重老化，海外巨头产能偏紧，无法满足AI数据中心建设需求
</p>
<div class="bg-orange-50 rounded-lg p-4">
<div class="flex items-center mb-2">
<i class="fas fa-history mr-2"></i>
<span class="font-semibold">设备老化: 70%超30年</span>
</div>
<div class="flex items-center">
<i class="fas fa-bolt mr-2"></i>
<span class="font-semibold">变压器需求: 230/345kV</span>
</div>
</div>
</div>
<div class="bg-white rounded-2xl p-8 hover-scale shadow-lg">
<div class="text-4xl mb-4 text-green-500">
<i class="fas fa-lightbulb"></i>
</div>
<h3 class="text-xl font-bold mb-4">解决方案多元化</h3>
<p class="text-gray-600 mb-4">
多路径并举解决缺电问题，推动电力设备出海和技术革新
</p>
<div class="space-y-2">
<div class="bg-green-50 rounded px-3 py-1 inline-block text-sm">
<i class="fas fa-fire mr-1"></i> 燃气轮机
</div>
<div class="bg-green-50 rounded px-3 py-1 inline-block text-sm">
<i class="fas fa-plug mr-1"></i> 变压器出海
</div>
<div class="bg-green-50 rounded px-3 py-1 inline-block text-sm">
<i class="fas fa-battery-full mr-1"></i> 储能系统
</div>
<div class="bg-green-50 rounded px-3 py-1 inline-block text-sm">
<i class="fas fa-microchip mr-1"></i> SST技术
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Stock Data Table Section -->
<section class="py-16 bg-white">
<div class="container mx-auto max-w-7xl px-4">
<h2 class="text-3xl font-bold text-center mb-12">
<i class="fas fa-chart-pie text-blue-600 mr-3"></i>
核心标的股票池
</h2>
<div class="bg-gradient-to-r from-blue-50 to-purple-50 rounded-2xl p-6 mb-8">
<div class="flex flex-wrap gap-4 justify-center">
<div class="flex items-center bg-white rounded-lg px-4 py-2 shadow">
<span class="w-3 h-3 bg-red-500 rounded-full mr-2"></span>
<span class="text-sm font-semibold">燃气轮机</span>
</div>
<div class="flex items-center bg-white rounded-lg px-4 py-2 shadow">
<span class="w-3 h-3 bg-green-500 rounded-full mr-2"></span>
<span class="text-sm font-semibold">储能</span>
</div>
<div class="flex items-center bg-white rounded-lg px-4 py-2 shadow">
<span class="w-3 h-3 bg-blue-500 rounded-full mr-2"></span>
<span class="text-sm font-semibold">变压器/SST</span>
</div>
<div class="flex items-center bg-white rounded-lg px-4 py-2 shadow">
<span class="w-3 h-3 bg-purple-500 rounded-full mr-2"></span>
<span class="text-sm font-semibold">AIDC相关</span>
</div>
</div>
</div>
<div class="table-container">
<table class="w-full bg-white rounded-lg overflow-hidden shadow-lg">
<thead class="bg-gradient-to-r from-indigo-600 to-purple-600 text-white">
<tr>
<th class="px-4 py-3 text-left">股票代码</th>
<th class="px-4 py-3 text-left">股票名称</th>
<th class="px-4 py-3 text-left">核心行业</th>
<th class="px-4 py-3 text-left">项目/客户</th>
<th class="px-4 py-3 text-left">信息来源</th>
</tr>
</thead>
<tbody id="stockTableBody">
<!-- Stock data will be inserted here by JavaScript -->
</tbody>
</table>
</div>
</div>
</section>
<!-- Investment Insights Section -->
<section class="py-16 bg-gray-100">
<div class="container mx-auto max-w-7xl px-4">
<h2 class="text-3xl font-bold text-center mb-12">
<i class="fas fa-binoculars text-green-600 mr-3"></i>
投资洞察与风险提示
</h2>
<div class="grid md:grid-cols-2 gap-8">
<div class="space-y-6">
<h3 class="text-2xl font-bold text-green-600 mb-4">
<i class="fas fa-chart-line mr-2"></i>投资机遇
</h3>
<div class="bg-white rounded-xl p-6 hover-scale shadow-lg">
<div class="flex items-start">
<div class="flex-shrink-0">
<div class="w-12 h-12 bg-green-100 rounded-full flex items-center justify-center">
<i class="fas fa-trophy text-green-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="font-bold text-lg mb-2">确定性最高：变压器出海</h4>
<p class="text-gray-600">解决当前最痛痛点（高压设备短缺），中国企业已具备全球竞争力</p>
</div>
</div>
</div>
<div class="bg-white rounded-xl p-6 hover-scale shadow-lg">
<div class="flex items-start">
<div class="flex-shrink-0">
<div class="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center">
<i class="fas fa-space-shuttle text-blue-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="font-bold text-lg mb-2">空间最大：储能与先进供电技术</h4>
<p class="text-gray-600">储能是解决电力波动的终极方案，SST代表下一代技术方向</p>
</div>
</div>
</div>
</div>
<div class="space-y-6">
<h3 class="text-2xl font-bold text-red-600 mb-4">
<i class="fas fa-exclamation-triangle mr-2"></i>潜在风险
</h3>
<div class="bg-white rounded-xl p-6 hover-scale shadow-lg border-l-4 border-red-500">
<div class="flex items-start">
<div class="flex-shrink-0">
<div class="w-12 h-12 bg-red-100 rounded-full flex items-center justify-center">
<i class="fas fa-globe-americas text-red-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="font-bold text-lg mb-2">地缘政治风险</h4>
<p class="text-gray-600">美国可能以"国家安全"为由设置贸易壁垒，影响出海逻辑</p>
</div>
</div>
</div>
<div class="bg-white rounded-xl p-6 hover-scale shadow-lg border-l-4 border-orange-500">
<div class="flex items-start">
<div class="flex-shrink-0">
<div class="w-12 h-12 bg-orange-100 rounded-full flex items-center justify-center">
<i class="fas fa-clock text-orange-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="font-bold text-lg mb-2">时间错配风险</h4>
<p class="text-gray-600">订单实际交付周期长达12-18个月，短期可能无法满足市场预期</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Key Tracking Metrics Section -->
<section class="py-16 bg-white">
<div class="container mx-auto max-w-7xl px-4">
<h2 class="text-3xl font-bold text-center mb-12">
<i class="fas fa-crosshairs text-purple-600 mr-3"></i>
后续关键跟踪指标
</h2>
<div class="grid md:grid-cols-4 gap-6">
<div class="bg-gradient-to-br from-blue-500 to-blue-600 text-white rounded-xl p-6 text-center hover-scale">
<i class="fas fa-file-contract text-4xl mb-4"></i>
<h3 class="font-bold text-lg mb-2">订单指标</h3>
<p class="text-sm opacity-90">核心企业框架协议落地</p>
<div class="mt-4 text-2xl font-bold">Q1-Q2</div>
</div>
<div class="bg-gradient-to-br from-green-500 to-green-600 text-white rounded-xl p-6 text-center hover-scale">
<i class="fas fa-industry text-4xl mb-4"></i>
<h3 class="font-bold text-lg mb-2">产能指标</h3>
<p class="text-sm opacity-90">海外工厂建设投产进度</p>
<div class="mt-4 text-2xl font-bold">持续</div>
</div>
<div class="bg-gradient-to-br from-purple-500 to-purple-600 text-white rounded-xl p-6 text-center hover-scale">
<i class="fas fa-chart-bar text-4xl mb-4"></i>
<h3 class="font-bold text-lg mb-2">财务指标</h3>
<p class="text-sm opacity-90">北美收入及毛利率变化</p>
<div class="mt-4 text-2xl font-bold">季度</div>
</div>
<div class="bg-gradient-to-br from-orange-500 to-orange-600 text-white rounded-xl p-6 text-center hover-scale">
<i class="fas fa-microchip text-4xl mb-4"></i>
<h3 class="font-bold text-lg mb-2">技术指标</h3>
<p class="text-sm opacity-90">SST产品商业化进展</p>
<div class="mt-4 text-2xl font-bold">2026</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="gradient-bg text-white py-12 px-4">
<div class="container mx-auto max-w-7xl">
<div class="text-center">
<h3 class="text-2xl font-bold mb-4">北美缺电AI电力投资主题</h3>
<p class="text-gray-200 mb-6">从宏大叙事到业绩验证的产业机遇</p>
<div class="flex justify-center space-x-6">
<div class="flex items-center">
<i class="fas fa-shield-alt mr-2"></i>
<span>高风险高收益</span>
</div>
<div class="flex items-center">
<i class="fas fa-calendar-alt mr-2"></i>
<span>中长期持有</span>
</div>
<div class="flex items-center">
<i class="fas fa-sync mr-2"></i>
<span>动态跟踪</span>
</div>
</div>
<div class="mt-8 text-sm opacity-75">
<p>⚠️ 投资有风险，入市需谨慎</p>
<p class="mt-2">本页面内容仅供参考，不构成投资建议</p>
</div>
</div>
</div>
</footer>
<script>
// Stock data
const stockData = {
"北美缺电AI电力(251105)": [
{"stock": "飞沃科技", "行业": "燃气轮机", "项目": "为GE Vernova提供燃气轮机燃烧室钣金件以及精密机加件", "reason": "官微"},
{"stock": "航亚科技", "行业": "燃气轮机", "项目": "压气机叶片、压气机盘、涡轮盘供货美国GE", "reason": "调研"},
{"stock": "杰瑞股份", "行业": "燃气轮机", "战略合作": "与西门子能源等国际知名燃气轮机制造商建立战略合作关系", "reason": "互动"},
{"stock": "应流股份", "行业": "燃气轮机", "客户": "GE/贝克休斯/西门子/卡特彼勒/斯伦贝谢等龙头", "reason": "纪要"},
{"stock": "万泽股份", "行业": "燃气轮机", "项目": "两机热端部件核心供应商，配套西门子等头部企业", "reason": "纪要"},
{"stock": "航宇科技", "行业": "燃气轮机", "项目": "两机环锻件核心供应商，配套GE Vernova/贝克休斯/西门子等", "reason": "纪要"},
{"stock": "博盈特焊", "行业": "燃气轮机", "项目": "2025年9月越南工厂投产，承接北美HRSR需求", "reason": "研报"},
{"stock": "福鞍股份", "行业": "燃气轮机", "项目": "拟打造燃气轮机制造基地；美国通用电气、福伊特合格供应商", "reason": "公告"},
{"stock": "豪迈科技", "行业": "燃气轮机", "客户": "GE、三菱、西门子", "reason": "调研"},
{"stock": "联德股份", "行业": "燃气轮机", "项目": "捆绑卡特彼勒中小型燃气机铸件需求", "reason": "纪要"},
{"stock": "隆达股份", "行业": "燃气轮机", "项目": "燃机材料出海No.1，出海占比1/3", "reason": "纪要"},
{"stock": "精工科技", "行业": "燃气轮机", "项目": "与清航航空协同开发燃气轮机热端部件，切入全球燃机巨头供应链", "reason": "纪要"},
{"stock": "三角防务", "行业": "燃气轮机", "项目": "与西门子能源签署燃机项目开发协议及框架订单协议", "reason": "公告"},
{"stock": "常宝股份", "行业": "燃气轮机", "项目": "HRSG（主要应用于燃气轮机余热锅炉发电领域）；通用电气优秀供应商", "reason": "调研/年报"},
{"stock": "阳光电源", "行业": "储能", "项目": "业务稳居北美第一梯队", "reason": "纪要"},
{"stock": "阿特斯", "行业": "储能", "项目": "CSIQ子公司Recurrent Energy为全球最大公共事业规模太阳能和储能电站项目开发商之一；25年储能出货中美国占比预计50%", "reason": "公开资料/纪要"},
{"stock": "通润装备", "行业": "储能", "项目": "正泰电源产品连续多年稳居北美工商业光伏逆变器出货量第一", "reason": "调研"},
{"stock": "海博思创", "行业": "储能", "战略合作": "已与美国头部储能系统集成商Fluence建立合作关系", "reason": "年报"},
{"stock": "科陆电子", "行业": "储能", "项目": "在北美储能市场有深厚积累，加州德州多地区储能运营项目收益领先", "reason": "纪要"},
{"stock": "西典新能", "行业": "储能", "项目": "储能CCS独供T和阳光，卡位北美60%以上市场份额", "reason": "纪要"},
{"stock": "东方日升", "行业": "储能", "项目": "美国南卡罗来纳州1GWh储能工厂将于12月投产", "reason": "纪要"},
{"stock": "天合光能", "行业": "储能", "项目": "海外订单超10GWh，预计2025-2026年交付", "reason": "纪要"},
{"stock": "思源电气", "行业": "储能", "项目": "出海领先，25H1海外收入占比30%左右，北美订单2-3亿", "reason": "纪要"},
{"stock": "冰轮环境", "行业": "储能", "项目": "IDC订单爆发；提供一次侧冷水机组，子公司顿汉布什为全球百年企业；拥有美国/墨西哥/马来西亚等海外工厂", "reason": "纪要"},
{"stock": "盛弘股份", "行业": "储能", "项目": "配合宁德时代研发大储P产品，并较早关注北美数据中心相关储能机会；布局中压UPS/HVDC/SST等数据中心电源解决方案", "reason": "纪要"},
{"stock": "宏发股份", "行业": "储能", "项目": "继电器世界第一，延伸到AIDC领域，已给台达等大客户长期供货和合作", "reason": "纪要"},
{"stock": "京泉华", "行业": "AIDC相关", "客户": "BE最大的磁性元器件供应商（约80%）", "reason": "纪要"},
{"stock": "三环集团", "行业": "AIDC相关", "项目": "为BE隔膜板供应商一供", "reason": "纪要"},
{"stock": "振华股份", "行业": "SOFC", "项目": "全球最大的铬盐生产商（SOFC燃料电池连接体采用95%纯铬+5%纯铁）", "reason": "纪要"},
{"stock": "雄韬股份", "行业": "SOFC", "项目": "燃料电池解决方案覆盖储能发电应用场景；美国销售份额占公司营业收入比例不到3%", "reason": "互动"},
{"stock": "潍柴动力", "行业": "SOFC", "战略合作": "与锡里斯签署SOFC生产制造授权；潍柴动力北美公司", "reason": "新闻/公告"},
{"stock": "中国西电", "行业": "变压器含SST", "项目": "子公司西安西电拥有固态变压器研发能力及相关产品；涉美业务主要是与公司第二大股东及其关联方之间的业务往来，共同参与全球输配电市场开发", "reason": "互动"},
{"stock": "京泉华", "行业": "变压器含SST", "项目": "专注于SST系统内部中压中频变压器，是目前全球少数具备可靠量产能力的厂商。公司绑定伊顿", "reason": "纪要"},
{"stock": "金盘科技", "行业": "变压器含SST", "项目": "已深度绑定亚马逊（签2年12亿元合作协议），对接XAI、Meta、谷歌、微软等；海外AIDC订单25年预计突破10亿元，26年有望翻倍增长", "reason": "纪要"},
{"stock": "伊戈尔", "行业": "变压器含SST", "项目": "26年数据中心订单预期从8亿上调至9亿，增量主要来自美国；SST团队扩充，预计26年推出高频变压器（有电感技术积累）/整机", "reason": "纪要"},
{"stock": "保变电气", "行业": "变压器含SST", "项目": "公司是少数能向北美美达斯国家市场出口大容量调相变压器的企业之一", "reason": "半年报"},
{"stock": "三变科技", "行业": "变压器含SST", "项目": "公司主变走进马斯克xAI超级计算机中心", "reason": "官微"},
{"stock": "顺钠股份", "行业": "变压器含SST", "战略合作": "公司通过孙公司顺特电气（持股75%，施耐德持股25%），成为施耐德在中国唯一的变压器合资企业", "reason": "纪要"},
{"stock": "特变电工", "行业": "变压器含SST", "项目": "输变电龙头，出海占比提升，变压器在美国有历史业绩", "reason": "纪要"},
{"stock": "四方股份", "行业": "变压器含SST", "项目": "SST客户持续洽谈中", "reason": "纪要"},
{"stock": "可立克", "行业": "变压器含SST", "项目": "SST产品可出整机，公司与全球头部企业保持良好合作关系（欧美大厂已把需求给到公司）", "reason": "纪要"},
{"stock": "新特电气", "行业": "变压器含SST", "项目": "公司在布局固态变压器配套用变压器的研发与创新；公司产品拥有北美UL认证", "reason": "调研/互动"},
{"stock": "华明装备", "行业": "变压器含SST", "项目": "变压器分接开关；持续推进北美市场认证", "reason": "研报"},
{"stock": "三星医疗", "行业": "其他", "项目": "下属控股子公司南森墨西哥中标美国Nexgrid智能电表框架项目，合同金额总计2,955.50万美元，约合2.12亿人民币", "reason": "公告"},
{"stock": "广信科技", "行业": "其他", "项目": "绝缘纸，西门子送样通过认证", "reason": "研报"},
{"stock": "神马电力", "行业": "其他", "项目": "全球复合绝缘子头部企业，是西门子、GE等全球头部电力设备企业核心供应商", "reason": "纪要"}
]
};
// Industry color mapping
const industryColors = {
"燃气轮机": "red",
"储能": "green",
"变压器含SST": "blue",
"AIDC相关": "purple",
"SOFC": "orange",
"其他": "gray"
};
// Populate table
function populateTable() {
const tbody = document.getElementById('stockTableBody');
const stocks = stockData["北美缺电AI电力(251105)"];
stocks.forEach((item, index) => {
const row = document.createElement('tr');
row.className = index % 2 === 0 ? 'bg-gray-50' : 'bg-white';
row.className += ' hover:bg-blue-50 transition-colors';
const industryColor = industryColors[item.行业] || 'gray';
row.innerHTML = `
<td class="px-4 py-3 font-semibold">${item.stock}</td>
<td class="px-4 py-3">${item.stock}</td>
<td class="px-4 py-3">
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-${industryColor}-100 text-${industryColor}-800">
${item.行业}
</span>
</td>
<td class="px-4 py-3 text-sm">
<div>${item.项目 || item.客户 || item.战略合作 || '-'}</div>
</td>
<td class="px-4 py-3">
<span class="inline-flex items-center px-2 py-1 rounded text-xs font-medium bg-gray-100 text-gray-800">
<i class="fas fa-info-circle mr-1"></i>
${item.reason}
</span>
</td>
`;
tbody.appendChild(row);
});
}
// Initialize on load
document.addEventListener('DOMContentLoaded', populateTable);
// Smooth scroll for navigation
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});
</script>
</body>
</html>