simonandClaude
60fb1b95e1
- 删除 index-2.php 中 PDF 报告卡片（6 个硬编码链接） - 研究报告卡片改为动态加载：扫描 research/yyyymmdd/ 子目录生成下拉框 - 选中日期后显示该目录下所有 HTML 文件（提取 <title> 作为链接名） Co-Authored-By: Claude <noreply@anthropic.com>
333 lines
18 KiB
PHP
333 lines
18 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>金融数据可视化门户</title>
|
|
<script src="/lib/js/tailwindcss-3.4.17.js"></script>
|
|
<script type="text/javascript" src="/lib/js/jquery-3.6.0.min.js"></script>
|
|
<link href="/lib/css/fontawesome-6.4.all.min.css" rel="stylesheet">
|
|
<script>
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
primary: '#165DFF',
|
|
secondary: '#36D399',
|
|
neutral: '#F8FAFC',
|
|
dark: '#1E293B'
|
|
},
|
|
fontFamily: {
|
|
inter: ['Inter', 'system-ui', 'sans-serif'],
|
|
},
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style type="text/tailwindcss">
|
|
@layer utilities {
|
|
.content-auto {
|
|
content-visibility: auto;
|
|
}
|
|
.card-hover {
|
|
@apply transition-all duration-300 hover:shadow-lg hover:scale-[1.02] hover:-translate-y-1;
|
|
}
|
|
.card-active {
|
|
@apply bg-primary/10 border-primary;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-50 font-inter text-dark min-h-screen">
|
|
<header class="bg-white shadow-sm sticky top-0 z-50">
|
|
<div class="container mx-auto px-4 py-4 flex justify-between items-center">
|
|
<div class="flex items-center space-x-2">
|
|
<i class="fa-solid fa-line-chart text-primary text-2xl"></i>
|
|
<h1 class="text-xl font-bold text-dark">金融数据可视化平台</h1>
|
|
</div>
|
|
<div class="flex items-center space-x-4">
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="container mx-auto px-4 py-8">
|
|
<div class="mb-8">
|
|
<h2 class="text-[clamp(1.5rem,3vw,2rem)] font-bold mb-4 flex items-center">
|
|
<i class="fa-solid fa-database text-primary mr-2"></i>数据概览
|
|
</h2>
|
|
<p class="text-gray-600 max-w-3xl">探索金融市场的各类数据可视化图表，包括股票、指数和房地产市场的趋势分析，帮助您做出更明智的投资决策。</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<!-- 股票数据卡片 -->
|
|
<div class="bg-white rounded-xl shadow-md p-6 card-hover">
|
|
<div class="flex items-center mb-6">
|
|
<div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center mr-3">
|
|
<i class="fa-solid fa-chart-line text-primary"></i>
|
|
</div>
|
|
<h3 class="text-lg font-semibold">股票数据分析</h3>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<div class="flex items-center">
|
|
<span class="text-gray-600 mr-2">个股：</span>
|
|
<div class="relative flex-1">
|
|
<input type="text" name="ts_code" id="ts_code" placeholder="输入股票代码"
|
|
class="w-full pl-3 pr-10 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary/50">
|
|
<button id="search-stock" class="absolute right-2 top-1/2 -translate-y-1/2 text-primary">
|
|
<i class="fa-solid fa-search"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="space-y-3">
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/stock_trend.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-arrow-trend-up text-primary w-6"></i>
|
|
<span>股价VS PE/PB/PS 趋势</span>
|
|
</a>
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/stockep.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-balance-scale text-secondary w-6"></i>
|
|
<span>股价VS EP</span>
|
|
</a>
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/stockmargin.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-money-bill-wave text-green-500 w-6"></i>
|
|
<span>股价VS 融资融券余额</span>
|
|
</a>
|
|
<!--<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/hkholdbycode.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-globe-asia text-blue-500 w-6"></i>
|
|
<span>股价VS 北向资金持股</span>-->
|
|
</a>
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/stockkeydata.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-table text-yellow-500 w-6"></i>
|
|
<span>个股基本面数据</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="mt-6 pt-6 border-t border-gray-200">
|
|
<h4 class="font-medium mb-3">指数分析</h4>
|
|
<div class="space-y-3">
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/index_trend.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-chart-area text-indigo-500 w-6"></i>
|
|
<span>指数VS PE/PB/PS/市值 趋势</span>
|
|
</a>
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/index_mv_all.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-chart-pie text-orange-500 w-6"></i>
|
|
<span>指数VS 两市总市值</span>
|
|
</a>
|
|
<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/index_margin.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-bank text-red-500 w-6"></i>
|
|
<span>指数VS 融资余额</span>
|
|
</a>
|
|
<!--<a href="#" onclick="openurl('https://echart.doorcome.cn/charts/moneyflow.php');"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-exchange text-pink-500 w-6"></i>
|
|
<span>指数VS 沪深港通资金流向</span>
|
|
</a>-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 研究报告数据卡片 -->
|
|
<div class="bg-white rounded-xl shadow-md p-6 card-hover">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-10 h-10 rounded-full bg-indigo-100 flex items-center justify-center mr-3">
|
|
<i class="fa-solid fa-file-text text-indigo-600"></i>
|
|
</div>
|
|
<h3 class="text-lg font-semibold">研究报告</h3>
|
|
</div>
|
|
<p class="text-gray-600 text-sm mb-4">按日期查看研究报告。</p>
|
|
<?php
|
|
$researchDir = __DIR__ . '/research';
|
|
$dateDirs = [];
|
|
foreach (glob($researchDir . '/*', GLOB_ONLYDIR) as $d) {
|
|
$bn = basename($d);
|
|
if (preg_match('/^\d{8}$/', $bn)) {
|
|
$dateDirs[] = $bn;
|
|
}
|
|
}
|
|
rsort($dateDirs);
|
|
if (empty($dateDirs)): ?>
|
|
<div class="p-4 border border-gray-200 rounded-lg text-gray-500 text-center">
|
|
<i class="fa-solid fa-inbox mr-2"></i>暂无日期归档的研究报告
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="mb-4">
|
|
<select id="reportDate" name="reportDate"
|
|
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary/50"
|
|
onchange="showReportGroup(this.value)">
|
|
<option value="">-- 选择日期 --</option>
|
|
<?php foreach ($dateDirs as $d): ?>
|
|
<option value="<?= $d ?>"><?= substr($d,0,4).'-'.substr($d,4,2).'-'.substr($d,6,2) ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
<?php foreach ($dateDirs as $d):
|
|
$htmls = glob("$researchDir/$d/*.html");
|
|
if (empty($htmls)) continue;
|
|
?>
|
|
<div class="report-group" id="report-<?= $d ?>" style="display:none;">
|
|
<div class="text-xs text-gray-400 mb-2 font-medium"><?= substr($d,0,4).'-'.substr($d,4,2).'-'.substr($d,6,2) ?></div>
|
|
<div class="space-y-2">
|
|
<?php foreach ($htmls as $f):
|
|
$content = file_get_contents($f);
|
|
preg_match('/<title>(.*?)<\/title>/i', $content, $m);
|
|
$title = !empty($m[1]) ? $m[1] : basename($f);
|
|
$relPath = ltrim(str_replace(__DIR__, '', $f), '/');
|
|
?>
|
|
<a href="/<?= $relPath ?>" target="_blank"
|
|
class="flex items-center p-2 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all text-sm">
|
|
<i class="fa-solid fa-file-lines text-indigo-500 w-5 mr-2"></i>
|
|
<span><?= htmlspecialchars($title) ?></span>
|
|
</a>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
</div>
|
|
<!-- 宏观研究数据卡片 -->
|
|
<div class="bg-white rounded-xl shadow-md p-6 card-hover">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-10 h-10 rounded-full bg-indigo-100 flex items-center justify-center mr-3">
|
|
<i class="fa-solid fa-chart-bar text-indigo-600"></i>
|
|
</div>
|
|
<h3 class="text-lg font-semibold">宏观研究</h3>
|
|
</div>
|
|
<p class="text-gray-600 text-sm mb-4">宏观量化分析报告，包含量化日报等研究内容。</p>
|
|
<a href="/quant/" class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition-colors text-sm font-medium">
|
|
查看报告 <i class="fa-solid fa-arrow-right ml-2"></i>
|
|
</a>
|
|
</div>
|
|
<!-- 房地产数据卡片 -->
|
|
<div class="bg-white rounded-xl shadow-md p-6 card-hover">
|
|
<div class="flex items-center mb-6">
|
|
<div class="w-10 h-10 rounded-full bg-secondary/10 flex items-center justify-center mr-3">
|
|
<i class="fa-solid fa-home text-secondary"></i>
|
|
</div>
|
|
<h3 class="text-lg font-semibold">房地产数据分析</h3>
|
|
</div>
|
|
|
|
<div class="mb-4 text-gray-600">
|
|
<p>以下数据主要聚焦于宁波地区房地产市场动态，包括挂牌数量、成交量等趋势分析。</p>
|
|
</div>
|
|
|
|
<div class="space-y-3">
|
|
<a href="https://echart.doorcome.cn/charts/realestate.php" target="_blank"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-building text-blue-500 w-6"></i>
|
|
<span>房地产挂牌数量趋势(宁波)</span>
|
|
</a>
|
|
<a href="https://echart.doorcome.cn/charts/estateNewTradeDaily.php" target="_blank"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-key text-green-500 w-6"></i>
|
|
<span>新房每日成交量(宁波)</span>
|
|
</a>
|
|
<a href="https://echart.doorcome.cn/charts/estateTradeDaily.php" target="_blank"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-exchange-alt text-yellow-500 w-6"></i>
|
|
<span>二手房每日成交量(宁波)</span>
|
|
</a>
|
|
<a href="https://echart.doorcome.cn/charts/estateListDaily.php" target="_blank"
|
|
class="flex items-center p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-all">
|
|
<i class="fa-solid fa-list-alt text-purple-500 w-6"></i>
|
|
<span>二手房每日挂牌量(宁波)</span>
|
|
</a>
|
|
</div>
|
|
<div class="mt-8 bg-blue-50 p-4 rounded-lg border border-blue-100">
|
|
<div class="flex items-start">
|
|
<i class="fa-solid fa-info-circle text-blue-500 mt-1 mr-3"></i>
|
|
<div>
|
|
<h4 class="font-medium text-blue-800 mb-1">数据更新说明</h4>
|
|
<p class="text-blue-700 text-sm">所有房地产数据每日凌晨自动更新，股票和指数数据在交易日收盘后2小时内更新。</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="bg-dark text-white mt-16">
|
|
<div class="container mx-auto px-4 py-12">
|
|
|
|
|
|
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-500 text-sm">
|
|
<div style='text-align: center'>Powered by Simon Young <span style="font-family: Arial; font-size: x-small; "> © </span>2019-<?=date('Y')?>
|
|
All Right Reserved <a href="mailto:simon.youngest@gmail.com" title='simon.youngest@gmail.com'>E-mail</a>.
|
|
</div>
|
|
<div style='text-align: center'>
|
|
<span style="color: grey; font-size: small; ">
|
|
<a href="https://beian.miit.gov.cn" target="_blank">浙ICP备18056264号-1</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
// 模拟打开链接的函数
|
|
function openurl(url) {
|
|
let ts_code = $("#ts_code").val();
|
|
url = url + '?ts_code='+ ts_code;
|
|
console.log(url);
|
|
window.open(url);
|
|
}
|
|
|
|
function showReportGroup(date) {
|
|
document.querySelectorAll('.report-group').forEach(el => el.style.display = 'none');
|
|
if (date) {
|
|
const target = document.getElementById('report-' + date);
|
|
if (target) target.style.display = 'block';
|
|
}
|
|
}
|
|
|
|
// 股票搜索功能
|
|
document.getElementById('search-stock').addEventListener('click', function() {
|
|
const stockCode = document.getElementById('ts_code').value.trim();
|
|
if (stockCode) {
|
|
alert(`搜索股票代码: ${stockCode}`);
|
|
// 这里可以添加实际的搜索逻辑
|
|
} else {
|
|
alert('请输入股票代码');
|
|
}
|
|
});
|
|
|
|
// 为链接添加点击效果
|
|
document.querySelectorAll('a').forEach(link => {
|
|
link.addEventListener('click', function(e) {
|
|
if (this.getAttribute('href') === '#') {
|
|
e.preventDefault();
|
|
}
|
|
// 添加点击效果
|
|
this.classList.add('card-active');
|
|
setTimeout(() => {
|
|
this.classList.remove('card-active');
|
|
}, 300);
|
|
});
|
|
});
|
|
|
|
// 模拟数据加载动画
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
setTimeout(() => {
|
|
document.querySelectorAll('.card-hover').forEach(card => {
|
|
card.style.opacity = '1';
|
|
card.style.transform = 'translateY(0)';
|
|
});
|
|
}, 300);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|
|
|