Files
vf_react/public/htmls/国资高息股.html
2025-10-11 16:16:02 +08:00

628 lines
36 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, shrink-to-fit=no">
<title>国资高息股 - 行业洞察报告</title>
<link href="https://fonts.googleapis.com/css?family=Inter:300,400,500,600,700,800" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<link href="https://cdn.jsdelivr.net/npm/daisyui@5/themes.css" rel="stylesheet" type="text/css" />
<script src="https://kit.fontawesome.com/1d2b6c4f81.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');
body {
font-family: 'Noto Sans SC', 'Inter', sans-serif;
background: linear-gradient(135deg, #f5f7fa 0%, #e4e8f0 100%);
min-height: 100vh;
}
.gradient-bg {
background: linear-gradient(135deg, #1a365d 0%, #2c5282 100%);
}
.card-shadow {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
.timeline-dot {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #3182ce;
position: absolute;
left: -8px;
top: 6px;
}
.timeline-line {
position: absolute;
left: 0;
top: 22px;
bottom: 0;
width: 2px;
background-color: #e2e8f0;
}
.highlight-text {
background: linear-gradient(120deg, #3182ce 0%, #63b3ed 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-weight: 700;
}
.industry-tag {
display: inline-block;
padding: 2px 8px;
border-radius: 4px;
font-size: 12px;
font-weight: 500;
margin-right: 4px;
}
.bank-tag { background-color: #e6f7ff; color: #1890ff; }
.coal-tag { background-color: #f6ffed; color: #52c41a; }
.construction-tag { background-color: #fff7e6; color: #fa8c16; }
.chemical-tag { background-color: #f9f0ff; color: #722ed1; }
.transport-tag { background-color: #e6fffb; color: #13c2c2; }
.realestate-tag { background-color: #fff1f0; color: #f5222d; }
.steel-tag { background-color: #fff0f6; color: #eb2f96; }
.environment-tag { background-color: #fcffe6; color: #a0d911; }
.other-tag { background-color: #f0f5ff; color: #2f54eb; }
.table-container {
overflow-x: auto;
}
@media (max-width: 768px) {
.section-title {
font-size: 1.5rem;
}
.card-body {
padding: 1rem;
}
}
</style>
</head>
<body>
<div class="container mx-auto px-4 py-8 max-w-7xl">
<!-- 标题部分 -->
<div class="gradient-bg rounded-2xl p-8 mb-8 text-white card-shadow">
<div class="flex flex-col md:flex-row justify-between items-start md:items-center">
<div>
<h1 class="text-3xl md:text-4xl font-bold mb-2">国资高息股</h1>
<p class="text-blue-200 text-lg">政策红利与基本面驱动的双重机遇</p>
</div>
<div class="mt-4 md:mt-0 bg-blue-900 bg-opacity-50 rounded-lg p-4">
<div class="text-sm text-blue-200">更新时间</div>
<div class="text-xl font-semibold">2025年1月</div>
</div>
</div>
</div>
<!-- 概念事件时间轴 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">概念事件时间轴</h2>
<div class="relative pl-8">
<div class="timeline-line"></div>
<div class="relative mb-8">
<div class="timeline-dot"></div>
<div class="bg-blue-50 rounded-lg p-4">
<div class="text-blue-700 font-semibold">2024-03-14</div>
<div class="mt-2">恒生指数公司推出"恒生高息股30指数",首次将"高息+国资"作为独立主题指数,标志着市场对国资高息股的官方认可。</div>
</div>
</div>
<div class="relative mb-8">
<div class="timeline-dot"></div>
<div class="bg-blue-50 rounded-lg p-4">
<div class="text-blue-700 font-semibold">2024-04</div>
<div class="mt-2">新"国九条"强制要求国企提高分红比例。</div>
</div>
</div>
<div class="relative mb-8">
<div class="timeline-dot"></div>
<div class="bg-blue-50 rounded-lg p-4">
<div class="text-blue-700 font-semibold">2024-08-13</div>
<div class="mt-2">险资举牌潮再起,<span class="font-semibold">太保寿险、长城人寿等9家险资</span>举牌公用事业、银行等高股息国企,举牌标的平均股息率<span class="font-semibold text-red-600">>5%</span>,直接验证险资对国资高息股的配置需求。</div>
</div>
</div>
<div class="relative mb-8">
<div class="timeline-dot"></div>
<div class="bg-blue-50 rounded-lg p-4">
<div class="text-blue-700 font-semibold">2024-12</div>
<div class="mt-2">央行窗口指导压降同业存款利率,银行负债成本下降<span class="font-semibold text-green-600">50-100BP</span>,直接增厚国有银行息差与分红能力。</div>
</div>
</div>
<div class="relative">
<div class="timeline-dot"></div>
<div class="bg-blue-50 rounded-lg p-4">
<div class="text-blue-700 font-semibold">2025-01-02</div>
<div class="mt-2">重阳投资明确将"高息股"列为2025年核心配置方向提出"股息率相对无风险利率利差回到合理区间",国资高息股成为"价值防御"首选。</div>
</div>
</div>
</div>
</div>
<!-- 核心观点摘要 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">核心观点摘要</h2>
<div class="bg-gradient-to-r from-blue-50 to-indigo-50 rounded-xl p-6 border-l-4 border-blue-500">
<p class="text-lg leading-relaxed">
国资高息股已从"政策红利"阶段进入<span class="highlight-text">基本面驱动阶段</span>:政策强制分红+险资万亿级欠配需求+低利率环境三重共振,<span class="font-semibold text-blue-700">未来2-3年将是持续配置窗口</span>。当前股息率与无风险利率利差<span class="font-bold text-red-600">>300BP</span><span class="font-semibold">中国神华股息率7.8% vs 10年期国债2.5%</span>),具备长期持有价值。
</p>
</div>
</div>
<!-- 核心驱动力 -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
<div class="bg-white rounded-2xl p-6 card-shadow">
<div class="flex items-center mb-4">
<div class="bg-blue-100 rounded-full p-3 mr-4">
<i class="fas fa-landmark text-blue-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold">政策刚性</h3>
</div>
<ul class="space-y-2 text-gray-700">
<li>• 新"国九条"要求央企分红比例<span class="font-semibold text-blue-600">≥30%</span></li>
<li>• 重庆国资委明确"提质增效"目标</li>
<li>• 2025年Q1起三年期高息定存集中到期<span class="font-semibold">20万亿规模</span></li>
<li>• 银行息差改善<span class="font-semibold text-green-600">6-8BP</span></li>
</ul>
</div>
<div class="bg-white rounded-2xl p-6 card-shadow">
<div class="flex items-center mb-4">
<div class="bg-green-100 rounded-full p-3 mr-4">
<i class="fas fa-chart-line text-green-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold">险资欠配</h3>
</div>
<ul class="space-y-2 text-gray-700">
<li>• 华泰证券测算需配置<span class="font-semibold text-green-600">5000-9000亿高息股</span></li>
<li>• 当前仅完成<span class="font-semibold text-red-600"><20%</span></li>
<li>• 港股股息率普遍高于A股<span class="font-semibold">200-300BP</span></li>
<li>• 长江基建港股股息率<span class="font-semibold">4.7% vs A股同类3.2%</span></li>
</ul>
</div>
<div class="bg-white rounded-2xl p-6 card-shadow">
<div class="flex items-center mb-4">
<div class="bg-purple-100 rounded-full p-3 mr-4">
<i class="fas fa-coins text-purple-600 text-xl"></i>
</div>
<h3 class="text-xl font-bold">资金属性</h3>
</div>
<ul class="space-y-2 text-gray-700">
<li>• 低利率环境下,股息率<span class="font-semibold text-purple-600">>4%的国资股</span>成为"类债券"替代品</li>
<li>• 北向资金2024年净流入高息板块<span class="font-semibold">超800亿</span></li>
<li>• 险资OCI科目配置需求强烈</li>
<li>• 长期资金偏好稳定现金流</li>
</ul>
</div>
</div>
<!-- 市场热度与情绪 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">市场热度与情绪</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<h3 class="text-lg font-semibold mb-3 text-blue-700">研报密集度</h3>
<div class="bg-blue-50 rounded-lg p-4">
<p class="mb-3">2024年7-12月<span class="font-semibold">中信建投、华泰、重阳等10家机构</span>发布专题报告,关键词"国资高息"提及率<span class="font-bold text-red-600">环比+340%</span></p>
<div class="h-48">
<canvas id="reportChart"></canvas>
</div>
</div>
</div>
<div>
<h3 class="text-lg font-semibold mb-3 text-blue-700">情绪分歧</h3>
<div class="bg-yellow-50 rounded-lg p-4">
<p class="mb-3">部分投资者担忧"高股息陷阱"(如银行股估值收缩),但路演显示<span class="font-semibold">中国神华、工商银行等国企现金流覆盖率>150%</span>,分红可持续性被低估。</p>
<div class="flex items-center justify-between mt-4">
<div class="text-center">
<div class="text-2xl font-bold text-green-600">65%</div>
<div class="text-sm text-gray-600">乐观预期</div>
</div>
<div class="text-center">
<div class="text-2xl font-bold text-yellow-600">25%</div>
<div class="text-sm text-gray-600">中性预期</div>
</div>
<div class="text-center">
<div class="text-2xl font-bold text-red-600">10%</div>
<div class="text-sm text-gray-600">悲观预期</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 预期差分析 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">预期差分析</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="bg-gray-50 rounded-xl p-5">
<h3 class="text-lg font-semibold mb-3 text-gray-700">市场共识</h3>
<p class="text-gray-600">认为高息股仅是防御工具,缺乏成长性,估值提升空间有限。</p>
<div class="mt-4 flex items-center">
<div class="bg-gray-200 rounded-full h-2 flex-grow mr-2">
<div class="bg-gray-500 h-2 rounded-full" style="width: 100%"></div>
</div>
<span class="text-sm text-gray-600">防御属性</span>
</div>
<div class="mt-2 flex items-center">
<div class="bg-gray-200 rounded-full h-2 flex-grow mr-2">
<div class="bg-gray-500 h-2 rounded-full" style="width: 30%"></div>
</div>
<span class="text-sm text-gray-600">成长属性</span>
</div>
</div>
<div class="bg-blue-50 rounded-xl p-5 border-l-4 border-blue-500">
<h3 class="text-lg font-semibold mb-3 text-blue-700">预期差</h3>
<p class="text-gray-700">国资高息股正从"股息收益"转向"股息+估值修复"双击。</p>
<div class="mt-4 space-y-2">
<div class="flex items-center">
<i class="fas fa-check-circle text-green-500 mr-2"></i>
<span><span class="font-semibold">太古股份</span>回购+分红合计收益<span class="font-bold text-green-600">8.8%</span></span>
</div>
<div class="flex items-center">
<i class="fas fa-check-circle text-green-500 mr-2"></i>
<span><span class="font-semibold">北控水务</span>水价上调<span class="font-bold text-green-600">20%</span>带动ROE从<span class="font-semibold">7.5%→8.2%</span></span>
</div>
</div>
</div>
</div>
</div>
<!-- 关键催化剂与未来发展路径 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">关键催化剂与未来发展路径</h2>
<div class="mb-8">
<h3 class="text-xl font-semibold mb-4 text-blue-700">近期催化剂3-6个月</h3>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-gradient-to-br from-blue-50 to-blue-100 rounded-xl p-5">
<div class="text-blue-700 font-bold mb-2">2025年Q1</div>
<p>三年期高息定存到期<span class="font-semibold">10万亿</span>,银行息差改善<span class="font-semibold text-green-600">6-8BP</span>,国有大行分红比例或从<span class="font-semibold">30%提至35%</span></p>
</div>
<div class="bg-gradient-to-br from-green-50 to-green-100 rounded-xl p-5">
<div class="text-green-700 font-bold mb-2">2025年3月</div>
<p>恒生高息股30指数首次调仓<span class="font-semibold">中国神华、工商银行</span>等权重或提升</p>
</div>
<div class="bg-gradient-to-br from-purple-50 to-purple-100 rounded-xl p-5">
<div class="text-purple-700 font-bold mb-2">2025年6月</div>
<p>非上市险企切换新会计准则IFRS17<span class="font-semibold">OCI科目高息股配置缺口5000亿</span>将加速建仓</p>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold mb-4 text-blue-700">长期路径2025-2027</h3>
<div class="relative">
<div class="absolute left-4 top-0 bottom-0 w-0.5 bg-gray-200"></div>
<div class="relative pl-10 pb-8">
<div class="absolute left-0 w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center text-white font-bold">1</div>
<div class="bg-blue-50 rounded-lg p-4">
<div class="font-semibold text-blue-700">阶段12025</div>
<p>政策驱动分红率提升,<span class="font-semibold">股息率中枢从5%→6%</span></p>
</div>
</div>
<div class="relative pl-10 pb-8">
<div class="absolute left-0 w-8 h-8 rounded-full bg-green-500 flex items-center justify-center text-white font-bold">2</div>
<div class="bg-green-50 rounded-lg p-4">
<div class="font-semibold text-green-700">阶段22026</div>
<p>险资完成OCI配置后<span class="font-semibold">国资高息股估值修复PE从8倍→10倍</span></p>
</div>
</div>
<div class="relative pl-10">
<div class="absolute left-0 w-8 h-8 rounded-full bg-purple-500 flex items-center justify-center text-white font-bold">3</div>
<div class="bg-purple-50 rounded-lg p-4">
<div class="font-semibold text-purple-700">阶段32027</div>
<p>行业成熟期I阶段如油服、医药商业国企加入高息阵营<span class="font-semibold">标的池扩容至200+只</span></p>
</div>
</div>
</div>
</div>
</div>
<!-- 产业链与核心公司深度剖析 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">产业链与核心公司深度剖析</h2>
<div class="mb-8">
<h3 class="text-xl font-semibold mb-4 text-blue-700">产业链图谱</h3>
<div class="bg-gray-50 rounded-xl p-6">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="text-center mb-6 md:mb-0">
<div class="bg-blue-100 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-3">
<i class="fas fa-industry text-blue-600 text-2xl"></i>
</div>
<div class="font-bold text-blue-700">上游</div>
<div class="text-sm mt-1">能源(煤炭/石油)</div>
<div class="mt-2">
<span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">中国神华</span>
<span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">中国石油</span>
</div>
</div>
<div class="text-center mb-6 md:mb-0">
<i class="fas fa-arrow-right text-gray-400 text-2xl mx-4 hidden md:block"></i>
<i class="fas fa-arrow-down text-gray-400 text-2xl my-2 md:hidden"></i>
</div>
<div class="text-center mb-6 md:mb-0">
<div class="bg-green-100 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-3">
<i class="fas fa-university text-green-600 text-2xl"></i>
</div>
<div class="font-bold text-green-700">中游</div>
<div class="text-sm mt-1">银行/公用事业</div>
<div class="mt-2">
<span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded">工商银行</span>
<span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded">重庆水务</span>
</div>
</div>
<div class="text-center">
<i class="fas fa-arrow-right text-gray-400 text-2xl mx-4 hidden md:block"></i>
<i class="fas fa-arrow-down text-gray-400 text-2xl my-2 md:hidden"></i>
</div>
<div class="text-center">
<div class="bg-purple-100 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-3">
<i class="fas fa-ship text-purple-600 text-2xl"></i>
</div>
<div class="font-bold text-purple-700">下游</div>
<div class="text-sm mt-1">交通运输/基建</div>
<div class="mt-2">
<span class="bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded">中远海控</span>
<span class="bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded">长江基建</span>
</div>
</div>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold mb-4 text-blue-700">核心玩家对比</h3>
<div class="overflow-x-auto">
<table class="min-w-full bg-white border border-gray-200 rounded-lg">
<thead>
<tr class="bg-gray-50">
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">公司</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">股息率</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">分红比例</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">催化剂</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">风险点</th>
</tr>
</thead>
<tbody>
<tr class="hover:bg-gray-50">
<td class="py-3 px-4 border-b font-semibold">中国神华</td>
<td class="py-3 px-4 border-b text-red-600 font-bold">7.8%</td>
<td class="py-3 px-4 border-b">70%</td>
<td class="py-3 px-4 border-b">煤价中枢上移+资本开支下降</td>
<td class="py-3 px-4 border-b">新能源替代风险</td>
</tr>
<tr class="hover:bg-gray-50">
<td class="py-3 px-4 border-b font-semibold">工商银行</td>
<td class="py-3 px-4 border-b text-red-600 font-bold">6.1%</td>
<td class="py-3 px-4 border-b">30%</td>
<td class="py-3 px-4 border-b">息差改善+不良率下降</td>
<td class="py-3 px-4 border-b">地产坏账暴露</td>
</tr>
<tr class="hover:bg-gray-50">
<td class="py-3 px-4 border-b font-semibold">长江基建</td>
<td class="py-3 px-4 border-b text-red-600 font-bold">4.7%</td>
<td class="py-3 px-4 border-b">60%</td>
<td class="py-3 px-4 border-b">英国降息周期+海外并购</td>
<td class="py-3 px-4 border-b">汇率波动</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- 潜在风险与挑战 -->
<div class="bg-white rounded-2xl p-6 mb-8 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">潜在风险与挑战</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<h3 class="text-lg font-semibold mb-3 text-red-700">商业化风险</h3>
<div class="space-y-3">
<div class="bg-red-50 rounded-lg p-4">
<div class="font-semibold text-red-700 mb-1">煤炭</div>
<p>新能源渗透率提升或压制长期煤价</p>
</div>
<div class="bg-red-50 rounded-lg p-4">
<div class="font-semibold text-red-700 mb-1">银行</div>
<p>若2025年LPR再降20BP息差可能二次探底</p>
</div>
</div>
</div>
<div>
<h3 class="text-lg font-semibold mb-3 text-yellow-700">政策风险</h3>
<div class="bg-yellow-50 rounded-lg p-4 mb-3">
<p>若国企考核从"ROE"转向"科技投入",分红比例可能被动下调</p>
</div>
<h3 class="text-lg font-semibold mb-3 text-orange-700">信息矛盾</h3>
<div class="bg-orange-50 rounded-lg p-4">
<p>股息率口径差异:路演中兖矿能源股息率<span class="font-semibold">53%</span>基于极端分红假设实际TTM股息率<span class="font-semibold">12%</span>,需警惕过度乐观预测</p>
</div>
</div>
</div>
</div>
<!-- 综合结论与投资启示 -->
<div class="bg-gradient-to-r from-blue-600 to-indigo-700 rounded-2xl p-6 mb-8 text-white card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">综合结论与投资启示</h2>
<div class="mb-6">
<h3 class="text-xl font-semibold mb-3">阶段判断</h3>
<p class="text-blue-100">国资高息股已从"政策主题"进入<span class="font-bold text-yellow-300">"盈利+分红"双轮驱动阶段</span>类似2016-2018年的美股高息股行情。</p>
</div>
<div class="mb-6">
<h3 class="text-xl font-semibold mb-3">最优方向</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-blue-800 bg-opacity-50 rounded-lg p-4">
<div class="font-semibold text-yellow-300 mb-2">港股高息国企</div>
<p><span class="font-semibold">长江基建、太古股份</span>:股息率<span class="font-bold">4-5%+回购3%</span>免税优势险资持有12个月免红利税</p>
</div>
<div class="bg-blue-800 bg-opacity-50 rounded-lg p-4">
<div class="font-semibold text-yellow-300 mb-2">A股能源/银行龙头</div>
<p><span class="font-semibold">中国神华、工商银行</span>:股息率<span class="font-bold">6-8%+估值修复15%</span></p>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold mb-3">跟踪指标</h3>
<div class="space-y-2">
<div class="flex items-start">
<div class="bg-yellow-400 text-blue-900 rounded-full w-6 h-6 flex items-center justify-center font-bold mr-3 flex-shrink-0">1</div>
<p><span class="font-semibold">险资OCI配置进度</span>(每季度披露持仓变动)</p>
</div>
<div class="flex items-start">
<div class="bg-yellow-400 text-blue-900 rounded-full w-6 h-6 flex items-center justify-center font-bold mr-3 flex-shrink-0">2</div>
<p><span class="font-semibold">国有大行分红比例</span>2025年3月年报验证是否提至35%</p>
</div>
<div class="flex items-start">
<div class="bg-yellow-400 text-blue-900 rounded-full w-6 h-6 flex items-center justify-center font-bold mr-3 flex-shrink-0">3</div>
<p><span class="font-semibold">港股通高息股30指数</span>成分股调整2025年6月生效</p>
</div>
</div>
</div>
</div>
<!-- 关联股票数据表格 -->
<div class="bg-white rounded-2xl p-6 card-shadow">
<h2 class="text-2xl font-bold mb-6 section-title">关联股票数据</h2>
<div class="table-container">
<table class="min-w-full bg-white border border-gray-200 rounded-lg">
<thead>
<tr class="bg-gray-50">
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">股票名称</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">行业</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">分类</th>
<th class="py-3 px-4 text-left text-sm font-semibold text-gray-700 border-b">入选理由</th>
</tr>
</thead>
<tbody id="stockTableBody">
<!-- 股票数据将通过JavaScript动态填充 -->
</tbody>
</table>
</div>
</div>
</div>
<script>
// 股票数据
const stockData = [{'stock': '光大银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合《关于加强监管防范风险推动资本市场高质量发展若干意见》中推动提高股息率、分红稳定性政策导向'}, {'stock': '招商银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动提高股息率和分红稳定性要求'}, {'stock': '中信银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '工商银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息优质公司激励政策'}, {'stock': '交通银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动分红稳定性提升'}, {'stock': '邮储银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合资本市场高质量发展导向'}, {'stock': '建设银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策支持提高股息率和分红频率'}, {'stock': '农业银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息优质公司激励政策'}, {'stock': '中国银行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动分红稳定性提升'}, {'stock': '渝农商行', '行业': '银行', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '兰花科创', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动提高股息率要求'}, {'stock': '冀中能源', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策支持高股息优质公司'}, {'stock': '山煤国际', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合分红稳定性提升政策导向'}, {'stock': '兖矿能源', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '恒源煤电', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息激励政策'}, {'stock': '开滦股份', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红频率'}, {'stock': '中国神华', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性要求'}, {'stock': '平煤股份', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '淮北矿业', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息优质公司激励政策'}, {'stock': '上海能源', '行业': '煤炭', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红稳定性'}, {'stock': '中国巨石', '行业': '建筑', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性要求'}, {'stock': '海螺水泥', '行业': '建筑', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '广咨国际', '行业': '建筑', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息激励政策'}, {'stock': '设计总院', '行业': '建筑', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红频率'}, {'stock': '隧道股份', '行业': '建筑', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性提升'}, {'stock': '安徽建工', '行业': '建筑', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '北元集团', '行业': '化工', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息优质公司激励政策'}, {'stock': '镇洋发展', '行业': '化工', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红稳定性'}, {'stock': '兴发集团', '行业': '化工', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性要求'}, {'stock': '云天化', '行业': '化工', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '中远海控', '行业': '交运', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息激励政策'}, {'stock': '华贸物流', '行业': '交运', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红频率'}, {'stock': '华域汽车', '行业': '交运', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性提升'}, {'stock': '浦东金桥', '行业': '房地产', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '深物业A', '行业': '房地产', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息优质公司激励政策'}, {'stock': '南钢股份', '行业': '钢铁', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红稳定性'}, {'stock': '中信特钢', '行业': '钢铁', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性要求'}, {'stock': '重庆水务', '行业': '环保', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '首创环保', '行业': '环保', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息激励政策'}, {'stock': '新媒股份', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红频率'}, {'stock': '富春环保', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性提升'}, {'stock': '中粮糖业', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}, {'stock': '国义招标', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合高股息优质公司激励政策'}, {'stock': '中国石化', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,政策推动提高股息率和分红稳定性'}, {'stock': '江中药业', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,符合政策推动分红稳定性要求'}, {'stock': '西部矿业', '行业': '其他', '分类': '国资', 'reason': '近12个月股息率大于4.5%,受益于资本市场高质量发展政策'}];
// 行业标签映射
const industryTagMap = {
'银行': 'bank-tag',
'煤炭': 'coal-tag',
'建筑': 'construction-tag',
'化工': 'chemical-tag',
'交运': 'transport-tag',
'房地产': 'realestate-tag',
'钢铁': 'steel-tag',
'环保': 'environment-tag',
'其他': 'other-tag'
};
// 填充股票表格
function populateStockTable() {
const tableBody = document.getElementById('stockTableBody');
stockData.forEach(stock => {
const row = document.createElement('tr');
row.className = 'hover:bg-gray-50';
const industryClass = industryTagMap[stock.行业] || 'other-tag';
row.innerHTML = `
<td class="py-3 px-4 border-b font-semibold">${stock.stock}</td>
<td class="py-3 px-4 border-b">
<span class="industry-tag ${industryClass}">${stock.行业}</span>
</td>
<td class="py-3 px-4 border-b">${stock.分类}</td>
<td class="py-3 px-4 border-b text-sm">${stock.reason}</td>
`;
tableBody.appendChild(row);
});
}
// 初始化研报密集度图表
function initReportChart() {
const ctx = document.getElementById('reportChart').getContext('2d');
new Chart(ctx, {
type: 'line',
data: {
labels: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
datasets: [{
label: '研报数量',
data: [2, 3, 2, 5, 4, 6, 8, 12, 15, 18, 22, 25],
borderColor: 'rgb(59, 130, 246)',
backgroundColor: 'rgba(59, 130, 246, 0.1)',
tension: 0.3,
fill: true
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: false
}
},
scales: {
y: {
beginAtZero: true,
grid: {
color: 'rgba(0, 0, 0, 0.05)'
}
},
x: {
grid: {
display: false
}
}
}
}
});
}
// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', function() {
populateStockTable();
initReportChart();
});
</script>
</body>
</html>
```