Files
vf_react/public/htmls/物流.html
2025-11-05 10:56:56 +08:00

558 lines
34 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" />
<!-- Font Awesome Icons -->
<script src="https://kit.fontawesome.com/1d2b6c4f81.js" crossorigin="anonymous"></script>
<!-- Tailwind CSS & DaisyUI -->
<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" />
<style>
body {
font-family: 'Inter', sans-serif;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
min-height: 100vh;
}
.card {
backdrop-filter: blur(10px);
background-color: rgba(255, 255, 255, 0.9);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
border: 1px solid rgba(255, 255, 255, 0.18);
transition: all 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 40px 0 rgba(31, 38, 135, 0.25);
}
.gradient-text {
background: linear-gradient(90deg, #1a73e8, #0d47a1);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.table-container {
overflow-x: auto;
}
.table {
min-width: 100%;
}
@media (max-width: 768px) {
.card {
margin-bottom: 1rem;
}
}
.highlight {
background-color: rgba(26, 115, 232, 0.1);
padding: 2px 4px;
border-radius: 3px;
font-weight: 600;
}
.timeline-dot {
position: relative;
padding-left: 20px;
}
.timeline-dot::before {
content: '';
position: absolute;
left: 0;
top: 8px;
width: 8px;
height: 8px;
background-color: #1a73e8;
border-radius: 50%;
}
#particles-js {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
}
</style>
</head>
<body>
<div id="particles-js"></div>
<div class="container mx-auto px-4 py-8 max-w-6xl">
<!-- 标题部分 -->
<div class="text-center mb-10">
<h1 class="text-4xl md:text-5xl font-bold gradient-text mb-4">物流行业洞察报告</h1>
<p class="text-gray-600 text-lg">政策与技术双轮驱动下的效率革命</p>
</div>
<!-- 概念事件 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-calendar-alt mr-3 text-blue-600"></i>概念事件
</h2>
<div class="space-y-4">
<div class="timeline-dot">
<p class="font-semibold text-gray-700">2024-11-27</p>
<p class="text-gray-600">中办、国办印发《有效降低全社会物流成本行动方案》,明确<span class="highlight">"结构性降本"</span>路径,提出<span class="highlight">多式联运、冷链、铁路、农村物流</span>四大补短板方向,并首次将<span class="highlight">"物流数科央企"</span>纳入顶层设计(招商局、中国物流集团等参与组建)。</p>
</div>
<div class="timeline-dot">
<p class="font-semibold text-gray-700">2024-12-20</p>
<p class="text-gray-600">国务院直管的首家物流数科央企成立,整合<span class="highlight">公路、铁路、航空、口岸</span>全场景数据,目标构建<span class="highlight">国家级物流大数据平台</span>,直接关联标的:<span class="highlight">云赛智联(上海数据集团)、中远海科(航运数据)、上海钢联(商贸物流)、通行宝(公路数字化)</span></p>
</div>
<div class="timeline-dot">
<p class="font-semibold text-gray-700">2025-05-29</p>
<p class="text-gray-600">无人物流车产业加速,顺丰无人车队从<span class="highlight">2024年600台扩产至2025年6000台</span>,九识智投交付周期延长至<span class="highlight">6个月</span>产能利用率120%),政策端<span class="highlight">103城开放路权</span>工信部2024</p>
</div>
<div class="timeline-dot">
<p class="font-semibold text-gray-700">2025-06-09</p>
<p class="text-gray-600">物流板块盘中异动,<span class="highlight">中创物流直线涨停</span>,飞力达、普路通等跟涨,催化因素或为<span class="highlight">低空物流+无人物流车</span>政策预期叠加。</p>
</div>
</div>
</div>
<!-- 核心观点摘要 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-lightbulb mr-3 text-yellow-500"></i>核心观点摘要
</h2>
<div class="bg-blue-50 rounded-lg p-4 border-l-4 border-blue-500">
<p class="text-gray-700">物流行业正从<span class="highlight">"规模扩张"</span>转向<span class="highlight">"效率驱动"</span>的新阶段,政策与技术双轮催化下,<span class="highlight">数字化(物流云、数据要素)、自动化(无人车、智能仓)、绿色化(新能源装备)</span>成为三大主线。<span class="highlight">短期看政策落地数科央企、路权开放中期看技术渗透率无人车从1.5%→3.2%长期看供应链重构全托管模式倒逼4PL能力</span></p>
</div>
</div>
<!-- 概念的核心逻辑与市场认知分析 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-chart-line mr-3 text-green-600"></i>概念的核心逻辑与市场认知分析
</h2>
<div class="mb-6">
<h3 class="text-xl font-semibold text-gray-700 mb-3">核心驱动力</h3>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-landmark mr-2 text-blue-500"></i>政策端
</h4>
<p class="text-gray-600 text-sm">从"降本"到"增效"2024年政策密度创历史新高。《行动方案》明确2025年社会物流总费用/GDP降至12%以下当前14.1%),倒逼<span class="highlight">多式联运(公转铁/水)、冷链、农村物流</span>投资加速。</p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-microchip mr-2 text-purple-500"></i>技术端
</h4>
<p class="text-gray-600 text-sm"><span class="highlight">无人配送</span>顺丰6000台规划<span class="highlight">物流云</span>(阿里云/华为云渗透率提升)、<span class="highlight">数据要素</span>(国家级平台整合万亿级数据资产)形成闭环。</p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-shopping-cart mr-2 text-red-500"></i>需求端
</h4>
<p class="text-gray-600 text-sm">跨境电商GMV 2024年达<span class="highlight">3.7万亿</span>CAGR 26%全托管模式Temu/SHEIN推动<span class="highlight">4PL分段招标</span>,物流企业需具备<span class="highlight">干线+清关+海外仓</span>全链路能力。</p>
</div>
</div>
</div>
<div class="mb-6">
<h3 class="text-xl font-semibold text-gray-700 mb-3">市场热度与情绪</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-yellow-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2">研报密集度</h4>
<p class="text-gray-600 text-sm">2024Q4以来<span class="highlight">中金、天风、浙商</span>等机构连发10+篇深度报告,聚焦<span class="highlight">东航物流(航空干线)、长久物流(汽车出口)、华贸物流(跨境电商)</span></p>
</div>
<div class="bg-orange-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2">情绪分歧</h4>
<p class="text-gray-600 text-sm">乐观派认为<span class="highlight">政策+技术</span>将复制2020-2021年快递行业估值扩张谨慎派担忧<span class="highlight">运价周期</span>如2023年空运运价回落50%)和<span class="highlight">产能过剩</span>2025年滚装船运力或过剩</p>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold text-gray-700 mb-3">预期差分析</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-purple-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2">市场忽略点1</h4>
<p class="text-gray-600 text-sm"><span class="highlight">物流数科央企</span><span class="highlight">数据变现能力</span>未被定价。其整合的<span class="highlight">公路、铁路、航空、口岸</span>数据可衍生<span class="highlight">供应链金融、动态定价</span>等增值服务(参考<span class="highlight">通行宝</span>ETC数据变现模式</p>
</div>
<div class="bg-indigo-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2">市场忽略点2</h4>
<p class="text-gray-600 text-sm"><span class="highlight">无人车渗透率</span>提升或超预期。顺丰6000台规划对应<span class="highlight">2025年快递总量1%替代</span>,但<span class="highlight">人力缺口2000万</span>可能加速替代参考美团无人机上海嘉定300站点落地</p>
</div>
</div>
</div>
</div>
<!-- 关键催化剂与未来发展路径 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-rocket mr-3 text-indigo-600"></i>关键催化剂与未来发展路径
</h2>
<div class="mb-6">
<h3 class="text-xl font-semibold text-gray-700 mb-3">近期催化剂3-6个月</h3>
<div class="space-y-3">
<div class="flex items-start">
<div class="bg-blue-100 rounded-full p-2 mr-3 mt-1">
<span class="text-blue-700 font-bold">1</span>
</div>
<p class="text-gray-600"><span class="highlight">物流数科央企</span>首批数据产品发布预计2025Q1<span class="highlight">云赛智联、中远海科</span>或参与运营。</p>
</div>
<div class="flex items-start">
<div class="bg-blue-100 rounded-full p-2 mr-3 mt-1">
<span class="text-blue-700 font-bold">2</span>
</div>
<p class="text-gray-600"><span class="highlight">无人车路权</span>第三批开放城市名单预计2025Q2<span class="highlight">中邮科技邮政市占率70%</span>直接受益。</p>
</div>
<div class="flex items-start">
<div class="bg-blue-100 rounded-full p-2 mr-3 mt-1">
<span class="text-blue-700 font-bold">3</span>
</div>
<p class="text-gray-600"><span class="highlight">跨境电商旺季</span>(黑五+圣诞备货),<span class="highlight">东航物流</span>欧美线运价或反弹至<span class="highlight">50元/kg</span>当前45元/kg</p>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold text-gray-700 mb-3">长期发展路径</h3>
<div class="space-y-4">
<div class="flex items-center">
<div class="bg-gradient-to-r from-blue-500 to-blue-700 text-white rounded-lg p-3 w-32 text-center font-semibold mr-4">
2025-2027
</div>
<p class="text-gray-600">政策驱动<span class="highlight">基础设施补短板</span>(冷链、农村物流),<span class="highlight">REITs</span>盘活存量资产(如<span class="highlight">盐田港REIT</span>年化分红4%)。</p>
</div>
<div class="flex items-center">
<div class="bg-gradient-to-r from-purple-500 to-purple-700 text-white rounded-lg p-3 w-32 text-center font-semibold mr-4">
2027-2030
</div>
<p class="text-gray-600">技术驱动<span class="highlight">无人化渗透率</span><span class="highlight">10%</span>当前1.5%<span class="highlight">物流云</span>市场规模突破<span class="highlight">1500亿</span>2024年387亿</p>
</div>
<div class="flex items-center">
<div class="bg-gradient-to-r from-green-500 to-green-700 text-white rounded-lg p-3 w-32 text-center font-semibold mr-4">
2030+
</div>
<p class="text-gray-600">供应链重构完成,<span class="highlight">4PL龙头</span>市占率超<span class="highlight">30%</span>当前不足3%<span class="highlight">数据要素</span>成为核心盈利点。</p>
</div>
</div>
</div>
</div>
<!-- 产业链与核心公司深度剖析 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-sitemap mr-3 text-teal-600"></i>产业链与核心公司深度剖析
</h2>
<div class="mb-6">
<h3 class="text-xl font-semibold text-gray-700 mb-3">产业链图谱</h3>
<div class="bg-gray-50 p-4 rounded-lg">
<div class="flex flex-col md:flex-row justify-between items-center mb-4">
<div class="text-center mb-4 md:mb-0">
<div class="bg-blue-100 rounded-lg p-3 mb-2">
<h4 class="font-semibold text-blue-700">上游</h4>
</div>
<p class="text-sm text-gray-600">芯片/传感器华为鲲鹏、阿里CIPU→无人车制造九识智投、中邮科技</p>
</div>
<div class="text-center mb-4 md:mb-0">
<div class="bg-purple-100 rounded-lg p-3 mb-2">
<h4 class="font-semibold text-purple-700">中游</h4>
</div>
<p class="text-sm text-gray-600">物流云(阿里云、华为云)→数据运营(云赛智联、通行宝)</p>
</div>
<div class="text-center">
<div class="bg-green-100 rounded-lg p-3 mb-2">
<h4 class="font-semibold text-green-700">下游</h4>
</div>
<p class="text-sm text-gray-600">场景应用(航空干线、汽车物流、冷链等)</p>
</div>
</div>
<div class="mt-4">
<h5 class="font-semibold text-gray-700 mb-2">下游应用细分:</h5>
<ul class="text-sm text-gray-600 space-y-1">
<li><span class="highlight">航空干线</span>东航物流欧美线市占率58%、华贸物流跨境电商直客占比42%</li>
<li><span class="highlight">汽车物流</span>长久物流滚装船运价11万美元/天→2025年运力缺口6%</li>
<li><span class="highlight">冷链</span>顺丰冷链98亿收入、京东物流40万㎡冷库</li>
</ul>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold text-gray-700 mb-3">核心玩家对比</h3>
<div class="overflow-x-auto">
<table class="min-w-full bg-white rounded-lg overflow-hidden">
<thead class="bg-gray-100">
<tr>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">公司</th>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">核心逻辑</th>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">验证数据</th>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">风险点</th>
</tr>
</thead>
<tbody>
<tr class="border-b border-gray-200">
<td class="py-3 px-4 font-semibold text-blue-600">东航物流</td>
<td class="py-3 px-4 text-gray-600">航空干线+跨境电商双重弹性</td>
<td class="py-3 px-4 text-gray-600">2024年欧美线运价同比+20%Q1长协价锁定50%</td>
<td class="py-3 px-4 text-gray-600">客机腹舱恢复超预期</td>
</tr>
<tr class="border-b border-gray-200">
<td class="py-3 px-4 font-semibold text-blue-600">长久物流</td>
<td class="py-3 px-4 text-gray-600">汽车出口+新能源电池回收</td>
<td class="py-3 px-4 text-gray-600">2024年净利润同比+370%,滚装船"长久星"回本周期2年</td>
<td class="py-3 px-4 text-gray-600">2025年新船交付过剩</td>
</tr>
<tr>
<td class="py-3 px-4 font-semibold text-blue-600">华贸物流</td>
<td class="py-3 px-4 text-gray-600">跨境电商4PL转型</td>
<td class="py-3 px-4 text-gray-600">直客占比42%→毛利率18%高于货代均值12%</td>
<td class="py-3 px-4 text-gray-600">平台政策变动Temu扣罚</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- 潜在风险与挑战 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-exclamation-triangle mr-3 text-red-600"></i>潜在风险与挑战
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-red-50 p-4 rounded-lg">
<h3 class="text-lg font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-microchip mr-2 text-red-500"></i>技术风险
</h3>
<p class="text-gray-600 text-sm"><span class="highlight">无人车</span>L4级自动驾驶在<span class="highlight">复杂城市场景</span>(如暴雨、施工路段)的可靠性未验证,<span class="highlight">九识智投</span>交付周期延长反映技术瓶颈。</p>
</div>
<div class="bg-orange-50 p-4 rounded-lg">
<h3 class="text-lg font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-dollar-sign mr-2 text-orange-500"></i>商业化风险
</h3>
<p class="text-gray-600 text-sm"><span class="highlight">物流云</span>:中小物流企业<span class="highlight">上云成本</span>年均50万/企业)可能抑制渗透率,<span class="highlight">阿里云</span>2024年物流客户续费率仅<span class="highlight">65%</span>低于政务85%)。</p>
</div>
<div class="bg-yellow-50 p-4 rounded-lg">
<h3 class="text-lg font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-balance-scale mr-2 text-yellow-500"></i>政策与竞争风险
</h3>
<p class="text-gray-600 text-sm"><span class="highlight">数据要素</span><span class="highlight">国家级平台</span><span class="highlight">地方国资</span>(如上海数据集团)存在<span class="highlight">数据权属争议</span>,可能影响<span class="highlight">云赛智联</span>等运营主体盈利分成。</p>
</div>
<div class="bg-purple-50 p-4 rounded-lg">
<h3 class="text-lg font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-search mr-2 text-purple-500"></i>信息交叉验证风险
</h3>
<p class="text-gray-600 text-sm"><span class="highlight">运价数据矛盾</span>中金路演称2024年欧美线运价<span class="highlight">45元/kg</span>,但东航物流年报显示<span class="highlight">长协价仅35元/kg</span>,差异或源于<span class="highlight">即期价vs长协价</span>统计口径。</p>
</div>
</div>
</div>
<!-- 综合结论与投资启示 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-trophy mr-3 text-yellow-500"></i>综合结论与投资启示
</h2>
<div class="mb-6">
<h3 class="text-xl font-semibold text-gray-700 mb-3">阶段判断</h3>
<div class="bg-gradient-to-r from-blue-50 to-indigo-50 p-4 rounded-lg">
<p class="text-gray-700">物流概念处于<span class="highlight">"政策驱动→技术验证"过渡期</span><span class="highlight">短期主题炒作</span>(如无人车、数据要素)与<span class="highlight">中期基本面改善</span>(跨境电商、冷链需求)并存。</p>
</div>
</div>
<div class="mb-6">
<h3 class="text-xl font-semibold text-gray-700 mb-3">投资方向</h3>
<div class="space-y-3">
<div class="flex items-start">
<div class="bg-blue-100 rounded-full p-2 mr-3 mt-1">
<span class="text-blue-700 font-bold">1</span>
</div>
<p class="text-gray-600"><span class="highlight">数据要素</span><span class="highlight">云赛智联</span>(上海数据集团唯一上市平台)——<span class="highlight">政策红利+数据变现</span>双重催化。</p>
</div>
<div class="flex items-start">
<div class="bg-blue-100 rounded-full p-2 mr-3 mt-1">
<span class="text-blue-700 font-bold">2</span>
</div>
<p class="text-gray-600"><span class="highlight">无人车</span><span class="highlight">中邮科技</span>邮政体系70%市占率)——<span class="highlight">路权开放+订单放量</span>弹性最大。</p>
</div>
<div class="flex items-start">
<div class="bg-blue-100 rounded-full p-2 mr-3 mt-1">
<span class="text-blue-700 font-bold">3</span>
</div>
<p class="text-gray-600"><span class="highlight">航空干线</span><span class="highlight">东航物流</span>——<span class="highlight">运价周期+跨境电商</span>戴维斯双击。</p>
</div>
</div>
</div>
<div>
<h3 class="text-xl font-semibold text-gray-700 mb-3">跟踪指标</h3>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-car mr-2 text-blue-500"></i>无人车
</h4>
<p class="text-gray-600 text-sm">顺丰/京东无人车月度投放量2025年目标6000/2000台</p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-database mr-2 text-purple-500"></i>数据要素
</h4>
<p class="text-gray-600 text-sm">物流数科央企首批数据产品GMV预计2025Q1超<span class="highlight">10亿元</span></p>
</div>
<div class="bg-gray-50 p-4 rounded-lg">
<h4 class="font-semibold text-gray-700 mb-2 flex items-center">
<i class="fas fa-chart-line mr-2 text-green-500"></i>运价
</h4>
<p class="text-gray-600 text-sm">TAC上海-洛杉矶空运指数(当前<span class="highlight">4500点</span>突破5000点将触发板块行情</p>
</div>
</div>
</div>
</div>
<!-- 关联股票数据 -->
<div class="card rounded-xl p-6 mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
<i class="fas fa-table mr-3 text-blue-600"></i>关联股票数据
</h2>
<div class="table-container">
<table class="min-w-full bg-white rounded-lg overflow-hidden">
<thead class="bg-gray-100">
<tr>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">股票代码</th>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">股票名称</th>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">分类</th>
<th class="py-3 px-4 text-left text-gray-700 font-semibold">原因</th>
</tr>
</thead>
<tbody id="stockTableBody">
<!-- 股票数据将通过JavaScript动态填充 -->
</tbody>
</table>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/tsparticles@3/tsparticles.bundle.min.js"></script>
<script>
// 初始化粒子背景
tsParticles.load("particles-js", {
background: {
color: {
value: "transparent",
},
},
fpsLimit: 60,
particles: {
color: {
value: "#1a73e8",
},
links: {
color: "#1a73e8",
distance: 150,
enable: true,
opacity: 0.3,
width: 1,
},
move: {
direction: "none",
enable: true,
outModes: {
default: "bounce",
},
random: false,
speed: 1,
straight: false,
},
number: {
density: {
enable: true,
area: 800,
},
value: 60,
},
opacity: {
value: 0.3,
},
shape: {
type: "circle",
},
size: {
value: { min: 1, max: 3 },
},
},
detectRetina: true,
});
// 股票数据
const stockData = [{'物流(240223)': [{'stock': '顺丰控股', '分类': '快递', 'reason': '属于快递分类'}, {'stock': '圆通速递', '分类': '快递', 'reason': '属于快递分类'}, {'stock': '韵达股份', '分类': '快递', 'reason': '属于快递分类'}, {'stock': '德邦股份', '分类': '快递', 'reason': '属于快递分类'}, {'stock': '申通快递', '分类': '快递', 'reason': '属于快递分类'}, {'stock': '中国外运', '分类': '海运代理', 'reason': '属于海运代理分类'}, {'stock': 'ST天顺', '分类': '海运代理', 'reason': '属于海运代理分类'}, {'stock': '中国铁物', '分类': '铁路物流', 'reason': '属于铁路物流分类'}, {'stock': 'ST天顺', '分类': '铁路物流', 'reason': '属于铁路物流分类'}, {'stock': '建发股份', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '物产中大', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '厦门国贸', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '厦门象屿', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '传化智联', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '怡亚通', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '嘉诚国际', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '畅联股份', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '上海雅仕', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': 'ST万林', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '原尚股份', '分类': '供应链', 'reason': '属于供应链分类'}, {'stock': '东航物流', '分类': '航空货运', 'reason': '属于航空货运分类'}, {'stock': '嘉友国际', '分类': '国际货代', 'reason': '属于国际货代分类'}, {'stock': '华贸物流', '分类': '国际货代', 'reason': '属于国际货代分类'}, {'stock': '中创物流', '分类': '国际货代', 'reason': '属于国际货代分类'}, {'stock': '海程邦达', '分类': '国际货代', 'reason': '属于国际货代分类'}, {'stock': '飞力达', '分类': '国际货代', 'reason': '属于国际货代分类'}, {'stock': '华光源海', '分类': '国际货代', 'reason': '属于国际货代分类'}, {'stock': '中储股份', '分类': '仓储物流', 'reason': '属于仓储物流分类'}, {'stock': '物产环能', '分类': '煤炭流通', 'reason': '属于煤炭流通分类'}, {'stock': '瑞茂通', '分类': '煤炭流通', 'reason': '属于煤炭流通分类'}, {'stock': '广汇能源', '分类': '煤炭流通', 'reason': '属于煤炭流通分类'}, {'stock': '密尔克卫', '分类': '危化品运输', 'reason': '属于危化品运输分类'}, {'stock': '永泰运', '分类': '危化品运输', 'reason': '属于危化品运输分类'}, {'stock': '宏川智慧', '分类': '石化物流', 'reason': '属于石化物流分类'}, {'stock': '恒基达鑫', '分类': '石化物流', 'reason': '属于石化物流分类'}, {'stock': '长久物流', '分类': '汽车物流', 'reason': '属于汽车物流分类'}, {'stock': '海晨股份', '分类': '汽车物流', 'reason': '属于汽车物流分类'}, {'stock': '长江投资', '分类': '汽车物流', 'reason': '属于汽车物流分类'}, {'stock': '三羊马', '分类': '汽车物流', 'reason': '属于汽车物流分类'}, {'stock': '福然德', '分类': '大宗物流', 'reason': '属于大宗物流分类'}, {'stock': '浙商中拓', '分类': '大宗物流', 'reason': '属于大宗物流分类'}, {'stock': '保税科技', '分类': '大宗物流', 'reason': '属于大宗物流分类'}, {'stock': '龙洲股份', '分类': '大宗物流', 'reason': '属于大宗物流分类'}, {'stock': '炬申股份', '分类': '大宗物流', 'reason': '属于大宗物流分类'}, {'stock': '东方嘉盛', '分类': '电子供应链', 'reason': '属于电子供应链分类'}, {'stock': '普路通', '分类': '电子供应链', 'reason': '属于电子供应链分类'}, {'stock': '新宁物流', '分类': '电子供应链', 'reason': '属于电子供应链分类'}, {'stock': '音飞储存', '分类': '物流装备', 'reason': '属于物流装备分类'}, {'stock': '中国外运', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '厦门象屿', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '中储股份', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '华贸物流', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '建发股份', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '物产中大', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '浙商中拓', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '保税科技', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '厦门国贸', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '畅联股份', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '东航物流', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '音飞储存', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '龙洲股份', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '怡亚通', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '物产环能', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '中国铁物', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '长江投资', '分类': '国资', 'reason': '属于国资分类'}, {'stock': '上海雅仕', '分类': '国资', 'reason': '属于国资分类'}]}];
// 填充股票数据表格
function fillStockTable() {
const tableBody = document.getElementById('stockTableBody');
const stocks = stockData[0]['物流(240223)'];
// 去重股票
const uniqueStocks = {};
stocks.forEach(stock => {
if (!uniqueStocks[stock.stock]) {
uniqueStocks[stock.stock] = {
name: stock.stock,
categories: [stock分类],
reasons: [stock.reason]
};
} else {
if (!uniqueStocks[stock.stock].categories.includes(stock.分类)) {
uniqueStocks[stock.stock].categories.push(stock.分类);
}
if (!uniqueStocks[stock.stock].reasons.includes(stock.reason)) {
uniqueStocks[stock.stock].reasons.push(stock.reason);
}
}
});
// 填充表格
Object.values(uniqueStocks).forEach(stock => {
const row = document.createElement('tr');
row.className = 'border-b border-gray-200 hover:bg-gray-50';
// 股票代码列(使用占位符)
const codeCell = document.createElement('td');
codeCell.className = 'py-3 px-4 text-gray-600';
codeCell.textContent = '----';
// 股票名称列
const nameCell = document.createElement('td');
nameCell.className = 'py-3 px-4 font-semibold text-blue-600';
nameCell.textContent = stock.name;
// 分类列
const categoryCell = document.createElement('td');
categoryCell.className = 'py-3 px-4';
const categorySpan = document.createElement('span');
categorySpan.className = 'inline-block bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full mr-1 mb-1';
categorySpan.textContent = stock.categories.join(', ');
categoryCell.appendChild(categorySpan);
// 原因列
const reasonCell = document.createElement('td');
reasonCell.className = 'py-3 px-4 text-gray-600 text-sm';
reasonCell.textContent = stock.reasons.join(', ');
row.appendChild(codeCell);
row.appendChild(nameCell);
row.appendChild(categoryCell);
row.appendChild(reasonCell);
tableBody.appendChild(row);
});
}
// 页面加载完成后填充表格
document.addEventListener('DOMContentLoaded', fillStockTable);
</script>
</body>
</html>
```