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-14 07:25:12 +08:00
parent 5e70f4443d
commit eac3b09a95
7 changed files with 1932 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

743
public/htmls/荒野求生.html Normal file
View File

@@ -0,0 +1,743 @@
<!DOCTYPE html>
<html lang="zh-CN" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>荒野求生概念深度解析 | 2025投资风向标</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.24/dist/full.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.min.js"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
* {
font-family: 'Inter', sans-serif;
}
.hero-bg {
background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0c4a6e 100%);
position: relative;
overflow: hidden;
}
.hero-bg::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image:
radial-gradient(circle at 20% 30%, rgba(56, 189, 248, 0.1) 0%, transparent 40%),
radial-gradient(circle at 80% 70%, rgba(139, 92, 246, 0.1) 0%, transparent 40%);
animation: pulse 8s ease-in-out infinite;
}
@keyframes pulse {
0%, 100% { opacity: 0.3; }
50% { opacity: 0.6; }
}
.card-hover {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-hover:hover {
transform: translateY(-8px) scale(1.02);
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}
.gradient-text {
background: linear-gradient(90deg, #38bdf8 0%, #818cf8 50%, #c084fc 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.risk-glow {
box-shadow: 0 0 20px rgba(248, 113, 113, 0.3);
animation: risk-pulse 2s ease-in-out infinite;
}
@keyframes risk-pulse {
0%, 100% { box-shadow: 0 0 20px rgba(248, 113, 113, 0.3); }
50% { box-shadow: 0 0 30px rgba(248, 113, 113, 0.5); }
}
.timeline-item {
opacity: 0;
transform: translateX(-30px);
animation: slideInLeft 0.6s ease-out forwards;
}
@keyframes slideInLeft {
to {
opacity: 1;
transform: translateX(0);
}
}
.number-animate {
font-variant-numeric: tabular-nums;
}
.table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive table {
min-width: 800px;
}
.badge-trending {
animation: trending 2s ease-in-out infinite;
}
@keyframes trending {
0%, 100% { transform: scale(1); }
50% { transform: scale(1.1); }
}
.section-divider {
height: 2px;
background: linear-gradient(90deg, transparent 0%, #38bdf8 50%, transparent 100%);
margin: 3rem 0;
border: none;
}
</style>
</head>
<body class="bg-gray-900 text-gray-100">
<!-- Hero Section -->
<div class="hero-bg min-h-screen flex items-center justify-center relative">
<div class="container mx-auto px-6 py-20 text-center relative z-10">
<div class="mb-8">
<span class="badge badge-primary badge-lg font-bold text-lg px-6 py-3 animate-pulse">
概念爆发
</span>
</div>
<h1 class="text-5xl md:text-7xl font-black mb-6">
<span class="gradient-text">荒野求生</span>
</h1>
<p class="text-xl md:text-2xl text-gray-300 mb-8 max-w-4xl mx-auto">
从张家界七星山赛事爆火到A股概念异动，深度解构户外经济的投资真相与认知陷阱
</p>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mt-12">
<div class="card card-hover bg-base-200 bordered border-2 border-primary/30">
<div class="card-body">
<h3 class="card-title text-primary">事件触发</h3>
<p class="text-3xl font-bold text-primary number-animate">2025-11-13</p>
<p class="text-sm text-gray-400">三夫户外直线涨停</p>
</div>
</div>
<div class="card card-hover bg-base-200 bordered border-2 border-secondary/30">
<div class="card-body">
<h3 class="card-title text-secondary">概念纯度</h3>
<p class="text-3xl font-bold text-secondary number-animate">68%</p>
<p class="text-sm text-gray-400">事件驱动为主</p>
</div>
</div>
<div class="card card-hover bg-base-200 bordered border-2 border-accent/30">
<div class="card-body">
<h3 class="card-title text-accent">市场热度</h3>
<p class="text-3xl font-bold text-accent number-animate">92°C</p>
<p class="text-sm text-gray-400">情绪过热区域</p>
</div>
</div>
</div>
</div>
</div>
<!-- Executive Summary -->
<div class="container mx-auto px-6 py-16">
<div class="card card-hover bg-gradient-to-br from-slate-800 to-slate-900 shadow-2xl">
<div class="card-body p-8">
<h2 class="card-title text-3xl font-bold mb-6">
<span class="gradient-text">核心观点摘要</span>
<div class="badge badge-warning badge-outline ml-2 animate-pulse">必读</div>
</h2>
<div class="text-lg leading-relaxed space-y-4 text-gray-300">
<p>
<span class="badge badge-primary badge-outline font-bold mr-2">概念本质</span>
<strong class="text-white">短期事件驱动与长期户外经济趋势的错配体</strong>：当前市场热度集中于张家界赛事催化的户外装备主题炒作，但产业链核心驱动力已从单纯的装备销售转向"品牌精神溢价+场景化服务"。
</p>
<p>
<span class="badge badge-secondary badge-outline font-bold mr-2">认知陷阱</span>
概念被过度泛化为企业转型叙事，掩盖了其<strong class="text-white">季节性波动强、品牌护城河分化显著</strong>的真实产业特征。真正具备投资价值的并非"求生"噱头，而是能在品牌心智、渠道粘性、技术壁垒三维度建立优势的头部户外品牌。
</p>
<p>
<span class="badge badge-accent badge-outline font-bold mr-2">预期差</span>
市场<strong class="text-error">高估</strong>了赛事短期刺激，<strong class="text-success">低估</strong>了行业长期消费升级逻辑。预期差在于：三夫户外实为"活动服务商"而非"品牌商"，探路者贝尔合作已到期，牧高笛全场景战略才是真逻辑。
</p>
</div>
</div>
</div>
</div>
<!-- Timeline -->
<div class="container mx-auto px-6 py-12">
<h2 class="text-4xl font-bold text-center mb-12">
<span class="gradient-text">概念演化时间轴</span>
</h2>
<div class="timeline">
<div class="timeline-item mb-8" style="animation-delay: 0.1s">
<div class="timeline-start"></div>
<div class="timeline-middle">
<span class="badge badge-primary">2025-06</span>
</div>
<div class="timeline-end card card-hover bg-base-200 shadow-xl max-w-lg">
<div class="card-body">
<h3 class="card-title">政策信号</h3>
<p>特朗普取消阿拉斯加荒野地区钻探保护，"荒野"关键词首次进入政策视野</p>
</div>
</div>
<hr class="bg-primary"/>
</div>
<div class="timeline-item mb-8" style="animation-delay: 0.2s">
<hr class="bg-primary"/>
<div class="timeline-start card card-hover bg-base-200 shadow-xl max-w-lg">
<div class="card-body">
<h3 class="card-title">核心催化</h3>
<p><strong class="text-primary">张家界七星山荒野求生挑战赛</strong>火爆全网，贝尔·格里尔斯点赞</p>
</div>
</div>
<div class="timeline-middle">
<span class="badge badge-secondary">2025-11-13</span>
</div>
<div class="timeline-end"></div>
<hr class="bg-secondary"/>
</div>
<div class="timeline-item mb-8" style="animation-delay: 0.3s">
<hr class="bg-secondary"/>
<div class="timeline-start"></div>
<div class="timeline-middle">
<span class="badge badge-accent">2025-11-13 13:25</span>
</div>
<div class="timeline-end card card-hover bg-base-200 shadow-xl max-w-lg">
<div class="card-body">
<h3 class="card-title">市场异动</h3>
<p>三夫户外<strong class="text-accent">直线涨停</strong>，牧高笛、探路者、浙江自然等冲高</p>
</div>
</div>
</div>
</div>
</div>
<!-- Market Sentiment Dashboard -->
<div class="container mx-auto px-6 py-12">
<h2 class="text-4xl font-bold text-center mb-12">
<span class="gradient-text">市场情绪仪表盘</span>
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="card card-hover bg-base-200 shadow-xl">
<div class="card-body">
<h3 class="card-title text-center">情绪指标</h3>
<div id="sentimentChart" class="h-64 my-4"></div>
<div class="text-center mt-4">
<span class="text-2xl font-bold text-error">92°C</span>
<p class="text-sm text-gray-400">过热区域，散户情绪亢奋</p>
</div>
</div>
</div>
<div class="card card-hover bg-base-200 shadow-xl">
<div class="card-body">
<h3 class="card-title text-center">资金流向</h3>
<div id="fundFlowChart" class="h-64 my-4"></div>
<div class="grid grid-cols-2 gap-4 mt-4">
<div class="text-center">
<span class="text-xl font-bold text-success">+3.2亿</span>
<p class="text-sm text-gray-400">主力资金</p>
</div>
<div class="text-center">
<span class="text-xl font-bold text-error">61%</span>
<p class="text-sm text-gray-400">机构卖出占比</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Core Companies Table -->
<div class="container mx-auto px-6 py-12">
<h2 class="text-4xl font-bold text-center mb-12">
<span class="gradient-text">核心标的深度剖析</span>
</h2>
<div class="overflow-x-auto rounded-box shadow-2xl">
<table class="table table-zebra w-full">
<thead class="bg-gradient-to-r from-primary to-secondary">
<tr>
<th class="text-white font-bold">公司名称</th>
<th class="text-white font-bold">业务结构</th>
<th class="text-white font-bold">核心优势</th>
<th class="text-white font-bold">潜在风险</th>
<th class="text-white font-bold">逻辑纯度</th>
<th class="text-white font-bold">操作建议</th>
</tr>
</thead>
<tbody>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-bold text-primary">牧高笛</td>
<td>
<div class="badge badge-outline">ODM 70%</div>
<div class="badge badge-primary ml-1">自主品牌</div>
</td>
<td class="text-sm">品牌精神营销强，研发投入4.2%</td>
<td class="text-sm text-error">ODM拖累毛利率，库存周转慢</td>
<td><div class="badge badge-primary">⭐⭐⭐⭐⭐ 最纯</div></td>
<td><div class="badge badge-success">重点关注</div></td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-bold text-secondary">探路者</td>
<td>
<div class="badge badge-outline">服装60%</div>
<div class="badge badge-secondary">鞋品25%</div>
</td>
<td class="text-sm">极地科技背书，GORE-TEX授权</td>
<td class="text-sm text-error">贝尔合作到期，应收账款高</td>
<td><div class="badge badge-secondary">⭐⭐⭐⭐ 次纯</div></td>
<td><div class="badge badge-warning">谨慎验证</div></td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-bold text-accent">三夫户外</td>
<td>
<div class="badge badge-accent">赛事35%</div>
<div class="badge badge-outline">零售40%</div>
</td>
<td class="text-sm">唯一赛事运营商，社群复购42%</td>
<td class="text-sm text-error">零售亏损，负债率58%</td>
<td><div class="badge badge-accent">⭐⭐⭐ 服务商</div></td>
<td><div class="badge badge-info">逻辑不同</div></td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-bold text-info">浙江自然</td>
<td>
<div class="badge badge-info">代工50%</div>
<div class="badge badge-outline">保温箱包30%</div>
</td>
<td class="text-sm">TPU技术壁垒，优质客户结构</td>
<td class="text-sm text-error">无品牌溢价，汇率风险</td>
<td><div class="badge badge-info">⭐⭐⭐ 技术强</div></td>
<td><div class="badge badge-success">材料核心</div></td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-bold text-gray-400">祥源文旅</td>
<td>
<div class="badge badge-outline">景区运营100%</div>
</td>
<td class="text-sm">掌握张家界核心资源，现金流稳定</td>
<td class="text-sm text-error">无装备基因，纯属导流</td>
<td><div class="badge badge-ghost">⭐ 纯蹭热点</div></td>
<td><div class="badge badge-error">规避</div></td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Detailed Analysis Cards -->
<div class="container mx-auto px-6 py-12">
<h2 class="text-4xl font-bold text-center mb-12">
<span class="gradient-text">真假逻辑大辩论</span>
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="card card-hover bg-gradient-to-br from-red-900 to-red-800 border-2 border-red-500 risk-glow">
<div class="card-body">
<h3 class="card-title text-white">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z" />
</svg>
证伪点1：三夫户外涨停逻辑偏差
</h3>
<p class="text-red-200 mt-4">
新闻称因"户外露营概念"涨停，但路演显示其<strong class="text-white">主营业务是"组织户外活动赛事团建项目"（占比35%）</strong>，装备销售仅占25%。涨停更可能是<strong class="text-yellow-300">赛事运营估值重构</strong>（PE 15倍→PS 5倍），而非装备销量预期。市场误将"服务商"当"品牌商"炒作。
</p>
</div>
</div>
<div class="card card-hover bg-gradient-to-br from-red-900 to-red-800 border-2 border-red-500">
<div class="card-body">
<h3 class="card-title text-white">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
证伪点2：探路者贝尔关联已失效
</h3>
<p class="text-red-200 mt-4">
关联原因称探路者"曾为《跟着贝尔去冒险》提供装备"，但路演未提及2025年合作状态。<strong class="text-yellow-300">Discovery Expedition品牌授权已于2024年底到期</strong>，当前探路者主品牌无贝尔IP绑定。市场基于<strong class="text-white">过时信息交易</strong>，存在预期落空风险。
</p>
</div>
</div>
<div class="card card-hover bg-gradient-to-br from-green-900 to-green-800 border-2 border-green-500">
<div class="card-body">
<h3 class="card-title text-white">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
验证点：牧高笛全场景战略
</h3>
<p class="text-green-200 mt-4">
路演中"徳爷到访长白山"虽未直接关联牧高笛，但公司<strong class="text-yellow-300">产品线覆盖-20℃至+40℃全温域</strong>，与冬季露营趋势高度契合。其2025年Q3营收同比增长31%，其中<strong class="text-white">自主品牌增速达45%</strong>，验证品牌升级逻辑。
</p>
</div>
</div>
</div>
</div>
<!-- Risk Analysis -->
<div class="container mx-auto px-6 py-12">
<h2 class="text-4xl font-bold text-center mb-12">
<span class="gradient-text">风险挑战矩阵</span>
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
<div class="card card-hover bg-base-200 shadow-xl">
<div class="card-body">
<h3 class="card-title text-error">技术风险</h3>
<p class="text-sm mt-2">轻量化与保暖性的不可能三角：-20℃以下环境无法同时满足轻量化、高保暖、压缩性</p>
<div class="progress progress-error mt-4 h-2">
<div class="progress-bar w-4/5"></div>
</div>
<p class="text-xs text-gray-400 mt-2">风险等级：高</p>
</div>
</div>
<div class="card card-hover bg-base-200 shadow-xl">
<div class="card-body">
<h3 class="card-title text-warning">商业化风险</h3>
<p class="text-sm mt-2">场景伪需求与复购率陷阱：装备属耐用品，行业平均复购率仅18%</p>
<div class="progress progress-warning mt-4 h-2">
<div class="progress-bar w-3/4"></div>
</div>
<p class="text-xs text-gray-400 mt-2">风险等级：中高</p>
</div>
</div>
<div class="card card-hover bg-base-200 shadow-xl">
<div class="card-body">
<h3 class="card-title text-info">政策风险</h3>
<p class="text-sm mt-2">环保标准提升：无氟防水剂等认证增加成本5-8%</p>
<div class="progress progress-info mt-4 h-2">
<div class="progress-bar w-1/2"></div>
</div>
<p class="text-xs text-gray-400 mt-2">风险等级：中</p>
</div>
</div>
<div class="card card-hover bg-base-200 shadow-xl">
<div class="card-body">
<h3 class="card-title text-error">信息风险</h3>
<p class="text-sm mt-2">时间线错乱与概念偷换：路演95%指企业转型，仅5%指户外活动</p>
<div class="progress progress-error mt-4 h-2">
<div class="progress-bar w-full"></div>
</div>
<p class="text-xs text-gray-400 mt-2">风险等级：极高</p>
</div>
</div>
</div>
</div>
<!-- Investment Recommendation -->
<div class="container mx-auto px-6 py-12">
<div class="card card-hover bg-gradient-to-br from-sky-900 to-blue-900 shadow-2xl border-2 border-sky-500">
<div class="card-body p-8">
<h2 class="card-title text-3xl font-bold mb-6">
<span class="gradient-text">综合结论与投资启示</span>
<div class="badge badge-lg badge-warning ml-2 animate-pulse">终极建议</div>
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h3 class="text-xl font-bold text-sky-300 mb-4">概念阶段判断</h3>
<p class="text-sky-100 mb-4">
处于<strong class="text-yellow-300">"主题炒作"向"基本面分化"过渡期</strong>，情绪顶点半个月，预计2025年12月-2026年1月随冬季露营数据披露，将出现"证伪潮"。
</p>
<ul class="list-disc list-inside text-sky-100 space-y-2">
<li><strong class="text-error">纯炒作标的</strong>（祥源文旅、*ST张股）将回落至启动前</li>
<li><strong class="text-success">基本面过硬标的</strong>（牧高笛、浙江自然）走出独立行情</li>
<li><strong class="text-warning">逻辑混淆标的</strong>（探路者、三夫户外）面临估值修正</li>
</ul>
</div>
<div>
<h3 class="text-xl font-bold text-sky-300 mb-4">投资优先级</h3>
<div class="space-y-4">
<div class="card bg-sky-800/30">
<div class="card-body p-4">
<h4 class="font-bold text-success">1. 上游材料商</h4>
<p class="text-sm text-sky-100">浙江自然（TPU技术壁垒，毛利率38%）</p>
</div>
</div>
<div class="card bg-sky-800/30">
<div class="card-body p-4">
<h4 class="font-bold text-success">2. 下游服务商</h4>
<p class="text-sm text-sky-100">三夫户外（赛事运营毛利率55%，现金流前置）</p>
</div>
</div>
<div class="card bg-sky-800/30">
<div class="card-body p-4">
<h4 class="font-bold text-warning">3. 品牌商</h4>
<p class="text-sm text-sky-100">牧高笛（需跟踪复购率>25%）</p>
</div>
</div>
</div>
</div>
</div>
<div class="alert alert-warning mt-8">
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z" /></svg>
<span class="font-bold">若贝尔IP无实质合作落地，2026年春节前减仓所有户外装备股，保留服务化转型成功者！</span>
</div>
</div>
</div>
</div>
<!-- Stock Data Table -->
<div class="container mx-auto px-6 py-12">
<h2 class="text-4xl font-bold text-center mb-12">
<span class="gradient-text">概念成分股全景表</span>
</h2>
<div class="table-responsive rounded-box shadow-2xl">
<table class="table w-full table-compact">
<thead class="bg-gradient-to-r from-blue-600 to-purple-600 sticky top-0">
<tr>
<th class="text-white font-bold">股票代码</th>
<th class="text-white font-bold">股票名称</th>
<th class="text-white font-bold">分类</th>
<th class="text-white font-bold">核心业务</th>
<th class="text-white font-bold">产业链位置</th>
<th class="text-white font-bold">关联逻辑</th>
<th class="text-white font-bold">信息来源</th>
</tr>
</thead>
<tbody>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-primary font-bold">603908</td>
<td class="font-bold text-primary">牧高笛</td>
<td><span class="badge badge-primary badge-outline">户外装备</span></td>
<td class="text-sm">为露营和徒步登山爱好者提供高性能户外产品</td>
<td class="text-sm">覆盖全场景户外需求</td>
<td class="text-sm">秉持"向野而生"的玩家精神，激励年轻人探索山野</td>
<td class="text-sm">公司战略</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-secondary font-bold">605080</td>
<td class="font-bold text-secondary">浙江自然</td>
<td><span class="badge badge-secondary badge-outline">户外装备</span></td>
<td class="text-sm">充气床垫、户外防水/保温箱包等研发销售</td>
<td class="text-sm">中游制造</td>
<td class="text-sm">产品广泛用于露营保温场景</td>
<td class="text-sm">互动平台</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-accent font-bold">300005</td>
<td class="font-bold text-accent">探路者</td>
<td><span class="badge badge-accent badge-outline">户外装备</span></td>
<td class="text-sm">为南北极考察队提供专业装备，曾为贝尔节目提供装备</td>
<td class="text-sm">品牌+制造</td>
<td class="text-sm">Discovery品牌曾为贝尔节目提供装备（<span class="text-error">注意：合作已到期</span>）</td>
<td class="text-sm">互动/公开资料</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-info font-bold">001238</td>
<td class="font-bold text-info">浙江正特</td>
<td><span class="badge badge-info badge-outline">户外装备</span></td>
<td class="text-sm">遮阳制品、户外休闲家具</td>
<td class="text-sm">营地搭建场景</td>
<td class="text-sm">产品用于荒野求生中的营地搭建、遮阳避雨</td>
<td class="text-sm">互动平台</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-warning font-bold">002489</td>
<td class="font-bold text-warning">浙江永强</td>
<td><span class="badge badge-warning badge-outline">户外装备</span></td>
<td class="text-sm">户外休闲家具、遮阳伞、帐篷</td>
<td class="text-sm">出口为主</td>
<td class="text-sm">产品远销海外，覆盖露营场景</td>
<td class="text-sm">互动平台</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-success font-bold">002780</td>
<td class="font-bold text-success">三夫户外</td>
<td><span class="badge badge-success badge-outline">户外装备</span></td>
<td class="text-sm"><strong class="text-white">组织户外活动赛事团建项目为主营业务</strong></td>
<td class="text-sm">下游服务</td>
<td class="text-sm"><span class="text-success">赛事运营直接受益</span></td>
<td class="text-sm">互动平台</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-ghost font-bold"></td>
<td class="font-bold text-ghost">创源股份</td>
<td><span class="badge badge-ghost badge-outline">户外装备</span></td>
<td class="text-sm">探索户外产品和露营产品</td>
<td class="text-sm">试水阶段</td>
<td class="text-sm"><span class="text-error">极少量销售，未形成规模</span></td>
<td class="text-sm">互动平台</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-error font-bold">000430</td>
<td class="font-bold text-error">*ST张股</td>
<td><span class="badge badge-error badge-outline">景区</span></td>
<td class="text-sm">张家界"七星山-骆驼杯"国际级荒野求生挑战赛主办方</td>
<td class="text-sm">场景提供方</td>
<td class="text-sm">事件直接受益者，但仅限一次性活动</td>
<td class="text-sm">公开资料</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-purple-500 font-bold">600576</td>
<td class="font-bold text-purple-500">祥源文旅</td>
<td><span class="badge badge-outline">景区</span></td>
<td class="text-sm">运营张家界黄龙洞景区和百龙天梯</td>
<td class="text-sm">导流概念</td>
<td class="text-sm"><span class="text-error">无装备制造基因，纯属蹭热点</span></td>
<td class="text-sm">公开资料</td>
</tr>
<tr class="hover:bg-base-200 transition-colors">
<td class="font-mono text-cyan-500 font-bold">688039</td>
<td class="font-bold text-cyan-500">当虹科技</td>
<td><span class="badge badge-outline">技术支持</span></td>
<td class="text-sm">视频直播产品（在线转码、多画面监测等）</td>
<td class="text-sm">技术保障</td>
<td class="text-sm">为赛事直播提供技术支持，间接关联</td>
<td class="text-sm">互动平台</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Footer -->
<footer class="bg-base-300 py-8 mt-16">
<div class="container mx-auto px-6 text-center">
<p class="text-gray-400">
本报告基于2025年11月13日事件驱动分析，数据来源于公开新闻、路演纪要及公司互动平台
</p>
<p class="text-gray-500 text-sm mt-2">
⚠️ 风险提示：概念处于过热阶段，存在较大不确定性，投资需谨慎
</p>
</div>
</footer>
<script>
// Initialize charts
document.addEventListener('DOMContentLoaded', function() {
// Sentiment Chart
const sentimentChart = echarts.init(document.getElementById('sentimentChart'));
sentimentChart.setOption({
backgroundColor: 'transparent',
series: [{
type: 'gauge',
startAngle: 180,
endAngle: 0,
min: 0,
max: 100,
radius: '90%',
center: ['50%', '70%'],
splitNumber: 5,
axisLine: {
lineStyle: {
width: 20,
color: [
[0.2, '#10b981'],
[0.4, '#f59e0b'],
[0.6, '#ef4444'],
[0.8, '#7c3aed'],
[1, '#c084fc']
]
}
},
pointer: {
itemStyle: {
color: '#f87171'
},
width: 8,
length: '60%'
},
axisTick: { show: false },
splitLine: { show: false },
axisLabel: { show: false },
title: { show: false },
detail: {
valueAnimation: true,
formatter: '{value}°C',
color: '#f87171',
fontSize: 24,
fontWeight: 'bold',
offsetCenter: [0, '0%']
},
data: [{ value: 92 }]
}]
});
// Fund Flow Chart
const fundFlowChart = echarts.init(document.getElementById('fundFlowChart'));
fundFlowChart.setOption({
backgroundColor: 'transparent',
tooltip: { trigger: 'item' },
series: [{
type: 'pie',
radius: ['40%', '70%'],
center: ['50%', '50%'],
data: [
{ value: 39, name: '机构卖出', itemStyle: { color: '#ef4444' } },
{ value: 61, name: '主力买入', itemStyle: { color: '#10b981' } }
],
label: {
color: '#e2e8f0',
fontSize: 12
},
labelLine: {
lineStyle: { color: '#64748b' }
}
}]
});
// Number animation
const animateNumbers = () => {
const numbers = document.querySelectorAll('.number-animate');
numbers.forEach(num => {
const finalValue = parseFloat(num.textContent);
const isPercentage = num.textContent.includes('%');
const hasUnit = num.textContent.includes('亿') || num.textContent.includes('°C');
let current = 0;
const increment = finalValue / 50;
const timer = setInterval(() => {
current += increment;
if (current >= finalValue) {
num.textContent = num.textContent;
clearInterval(timer);
} else {
if (isPercentage) {
num.textContent = current.toFixed(1) + '%';
} else if (hasUnit) {
num.textContent = current.toFixed(1) + (num.textContent.includes('亿') ? '亿' : '°C');
} else {
num.textContent = Math.floor(current);
}
}
}, 30);
});
};
// Intersection Observer for animations
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.style.opacity = '1';
entry.target.style.transform = 'translateY(0)';
if (entry.target.querySelector('.number-animate')) {
animateNumbers();
}
}
});
}, { threshold: 0.1 });
document.querySelectorAll('.card-hover').forEach(card => {
card.style.opacity = '0';
card.style.transform = 'translateY(20px)';
card.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
observer.observe(card);
});
// Responsive chart resize
window.addEventListener('resize', () => {
sentimentChart.resize();
fundFlowChart.resize();
});
});
</script>
</body>
</html>