qwq/deep
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

4.29技术中心合并前更改

Browse Source 
Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
qwq
2026-04-29 18:53:24 +08:00
co-authored by Copilot
parent 7687b4e7b8
commit ec35590493
25 changed files with 792 additions and 329 deletions
Download Patch File Download Diff File Expand all files Collapse all files
about_new.html
+57 -52
View File
@@ -208,21 +208,21 @@
/* ========== 旋转装饰环 ========== */ /* ========== 旋转装饰环 ========== */
.orbit-ring { .orbit-ring {
position: absolute; position: absolute;
border: 1px solid rgba(22,93,255,0.1); border: 1px solid rgba(22,93,255,0.3);
border-radius: 50%; border-radius: 50%;
animation: rotate360 30s linear infinite; animation: rotate360 30s linear infinite;
} }
.orbit-ring::after { .orbit-ring::after {
content: ''; content: '';
position: absolute; position: absolute;
width: 6px; width: 8px;
height: 6px; height: 8px;
background: #165DFF; background: #165DFF;
border-radius: 50%; border-radius: 50%;
top: -3px; top: -4px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
box-shadow: 0 0 10px rgba(22,93,255,0.5); box-shadow: 0 0 15px rgba(22,93,255,0.8);
} }
/* ========== 核心技术卡片光效 ========== */ /* ========== 核心技术卡片光效 ========== */
@@ -331,7 +331,7 @@
/* ========== 知识产权图片网格 ========== */ /* ========== 知识产权图片网格 ========== */
.ip-grid-container { .ip-grid-container {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
gap: 16px; gap: 16px;
padding: 20px 0; padding: 20px 0;
} }
@@ -611,23 +611,31 @@
<div class="reveal"> <div class="reveal">
<div class="grid grid-cols-2 md:grid-cols-4 gap-6"> <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
<div class="bg-gradient-to-br from-primary/5 to-transparent border border-primary/10 rounded-2xl p-6 text-center hover-card"> <div class="bg-gradient-to-br from-primary/5 to-transparent border border-primary/10 rounded-2xl p-6 text-center hover-card">
<div class="text-4xl font-extrabold text-primary mb-2 stat-number" data-target="30">0</div> <div class="flex items-end justify-center mb-2">
<div class="text-xs text-primary/60 font-medium mb-1">+</div> <div class="text-4xl font-extrabold text-primary stat-number" data-target="20">0</div>
<div class="text-gray-400 text-sm">核心技术专利</div> <div class="text-2xl text-primary/80 font-bold ml-1 mb-1">+</div>
</div>
<div class="text-gray-400 text-sm">处理器IP型号</div>
</div> </div>
<div class="bg-gradient-to-br from-accent/5 to-transparent border border-accent/10 rounded-2xl p-6 text-center hover-card"> <div class="bg-gradient-to-br from-accent/5 to-transparent border border-accent/10 rounded-2xl p-6 text-center hover-card">
<div class="text-4xl font-extrabold text-accent mb-2 stat-number" data-target="50">0</div> <div class="flex items-end justify-center mb-2">
<div class="text-xs text-accent/60 font-medium mb-1">+</div> <div class="text-4xl font-extrabold text-accent stat-number" data-target="30">0</div>
<div class="text-gray-400 text-sm">全球客户</div> <div class="text-2xl text-accent/80 font-bold ml-1 mb-1">+</div>
</div>
<div class="text-gray-400 text-sm">知识产权</div>
</div> </div>
<div class="bg-gradient-to-br from-green-500/5 to-transparent border border-green-500/10 rounded-2xl p-6 text-center hover-card"> <div class="bg-gradient-to-br from-green-500/5 to-transparent border border-green-500/10 rounded-2xl p-6 text-center hover-card">
<div class="text-4xl font-extrabold text-green-400 mb-2 stat-number" data-target="100">0</div> <div class="flex items-end justify-center mb-2">
<div class="text-xs text-green-400/60 font-medium mb-1">+</div> <div class="text-4xl font-extrabold text-green-400 stat-number" data-target="80">0</div>
<div class="text-2xl text-green-400/80 font-bold ml-1 mb-1">+</div>
</div>
<div class="text-gray-400 text-sm">专业技术人员</div> <div class="text-gray-400 text-sm">专业技术人员</div>
</div> </div>
<div class="bg-gradient-to-br from-purple-500/5 to-transparent border border-purple-500/10 rounded-2xl p-6 text-center hover-card"> <div class="bg-gradient-to-br from-purple-500/5 to-transparent border border-purple-500/10 rounded-2xl p-6 text-center hover-card">
<div class="text-4xl font-extrabold text-purple-400 mb-2 stat-number" data-target="8">0</div> <div class="flex items-end justify-center mb-2">
<div class="text-xs text-purple-400/60 font-medium mb-1">+</div> <div class="text-4xl font-extrabold text-purple-400 stat-number" data-target="8">0</div>
<div class="text-2xl text-purple-400/80 font-bold ml-1 mb-1">+</div>
</div>
<div class="text-gray-400 text-sm">行业解决方案</div> <div class="text-gray-400 text-sm">行业解决方案</div>
</div> </div>
</div> </div>
@@ -796,47 +804,47 @@
</div> </div>
<div class="ip-grid-container"> <div class="ip-grid-container">
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/WingIDE创建项目平台1-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/WingIDE创建项目平台1-1.jpg" alt="软件著作权" draggable="false">
<p>WingIDE创建项目平台</p> <p>WingIDE创建项目平台</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/Maotu软件前端平台1-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/Maotu软件前端平台1-1.jpg" alt="软件著作权" draggable="false">
<p>Maotu软件前端平台</p> <p>Maotu软件前端平台</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/MaotuArc-Studio后端系统1-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/MaotuArc-Studio后端系统1-1.jpg" alt="软件著作权" draggable="false">
<p>MaotuArc-Studio后端系统</p> <p>MaotuArc-Studio后端系统</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/CBT工具软件1-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/CBT工具软件1-1.jpg" alt="软件著作权" draggable="false">
<p>CBT工具软件</p> <p>CBT工具软件</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/Wing-M130处理器IP核软件-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/Wing-M130处理器IP核软件-1.jpg" alt="软件著作权" draggable="false">
<p>Wing-M130处理器IP核软件</p> <p>Wing-M130处理器IP核软件</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/WingIDE插件快速配置系统V1_0软著证书-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/WingIDE插件快速配置系统V1_0软著证书-1.jpg" alt="软件著作权" draggable="false">
<p>WingIDE插件快速配置系统V1_0</p> <p>WingIDE插件快速配置系统V1_0</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/STUDIO后端软件接口调试软件V1_0软著证书-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/STUDIO后端软件接口调试软件V1_0软著证书-1.jpg" alt="软件著作权" draggable="false">
<p>STUDIO后端软件接口调试软件</p> <p>STUDIO后端软件接口调试软件</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/RISCV时序精准仿真模型平台-上海隼瞻科技有限公司-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/RISCV时序精准仿真模型平台-上海隼瞻科技有限公司-1.jpg" alt="软件著作权" draggable="false">
<p>RISCV时序精准仿真模型平台</p> <p>RISCV时序精准仿真模型平台</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/RISC-V时序仿真优化平台V1_0软著证书-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/RISC-V时序仿真优化平台V1_0软著证书-1.jpg" alt="软件著作权" draggable="false">
<p>RISC-V时序仿真优化平台</p> <p>RISC-V时序仿真优化平台</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/RISCV仿真器指令转换与集成系统-隼瞻科技（深圳）有限公司-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/RISCV仿真器指令转换与集成系统-隼瞻科技（深圳）有限公司-1.jpg" alt="软件著作权" draggable="false">
<p>RISCV仿真器指令转换与集成系统</p> <p>RISCV仿真器指令转换与集成系统</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/MaotuArc-Studio前端平台-隼瞻科技（珠海）有限公司-1.jpg" alt="软件著作权" draggable="false"> <img src="/wp-content/uploads/2026/01/MaotuArc-Studio前端平台-隼瞻科技（珠海）有限公司-1.jpg" alt="软件著作权" draggable="false">
<p>MaotuArc Studio前端平台</p> <p>MaotuArc Studio前端平台</p>
</div> </div>
</div> </div>
@@ -851,26 +859,23 @@
</h3> </h3>
<span class="ml-4 text-gray-400 text-sm">5 项资质认证</span> <span class="ml-4 text-gray-400 text-sm">5 项资质认证</span>
</div> </div>
<div class="ip-grid-container" style="grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));">
<div class="ip-grid-item"> <div class="flex flex-wrap gap-4 items-start">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/南京隼瞻QMS-中文正式ISO9001-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;"> <div class="ip-grid-item w-[160px] md:w-[180px]">
<p>南京隼瞻QMS(中)</p> <img src="/wp-content/uploads/2026/04/广州隼瞻2025年国高证书-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:4/3;">
<p>高新技术企业</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item w-[160px] md:w-[180px]">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/南京隼瞻QMS-英文正式ISO9001-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;"> <img src="/wp-content/uploads/2026/04/20260429-141227.png" alt="资质认证" draggable="false" style="aspect-ratio:4/3;">
<p>南京隼瞻QMS(英)</p> <p>专精特新中小企业</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item w-[120px] md:w-[135px]">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/SGS认证ISO-26262车规-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;"> <img src="/wp-content/uploads/2026/01/SGS认证ISO-26262车规-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;">
<p>SGS ISO-26262车规</p> <p>SGS ISO-26262车规</p>
</div> </div>
<div class="ip-grid-item"> <div class="ip-grid-item w-[120px] md:w-[135px]">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/QMS-隼瞻科技（广州）有限公司中文-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;"> <img src="/wp-content/uploads/2026/01/QMS-隼瞻科技（广州）有限公司中文-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;">
<p>QMS广州(中)</p> <p>ISO 9001:2015</p>
</div>
<div class="ip-grid-item">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2026/01/QMS-隼瞻科技（广州）有限公司英文-1.jpg" alt="资质认证" draggable="false" style="aspect-ratio:3/4;">
<p>QMS广州(英)</p>
</div> </div>
</div> </div>
</div> </div>
@@ -1331,9 +1336,9 @@
</div> </div>
<div class="grid grid-cols-1 sm:grid-cols-3 gap-6"> <div class="grid grid-cols-1 sm:grid-cols-3 gap-6">
<div class="hover-card group rounded-2xl overflow-hidden border border-gray-700/50 bg-[#0f172a]"> <div class="hover-card group rounded-2xl overflow-hidden border border-gray-700/50 bg-[#0f172a]">
<div class="h-40 bg-gradient-to-br from-blue-500/20 to-purple-500/20 flex items-center justify-center relative overflow-hidden"> <div class="h-40 relative overflow-hidden bg-[#0f172a]">
<div class="absolute inset-0 hex-pattern opacity-20"></div> <img src="/wp-content/uploads/2026/04/20260429-171045.png" alt="技术分享会" class="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105">
<i class="fa fa-code text-5xl text-blue-400/40 group-hover:text-blue-400/70 transition-colors duration-300 group-hover:scale-110 transform transition-transform"></i> <div class="absolute inset-0 bg-gradient-to-t from-[#0f172a]/75 via-[#0f172a]/20 to-transparent"></div>
</div> </div>
<div class="p-5"> <div class="p-5">
<h4 class="font-semibold text-white mb-2">技术分享会</h4> <h4 class="font-semibold text-white mb-2">技术分享会</h4>
@@ -1341,9 +1346,9 @@
</div> </div>
</div> </div>
<div class="hover-card group rounded-2xl overflow-hidden border border-gray-700/50 bg-[#0f172a]"> <div class="hover-card group rounded-2xl overflow-hidden border border-gray-700/50 bg-[#0f172a]">
<div class="h-40 bg-gradient-to-br from-green-500/20 to-cyan-500/20 flex items-center justify-center relative overflow-hidden"> <div class="h-40 relative overflow-hidden bg-[#0f172a]">
<div class="absolute inset-0 dot-pattern opacity-20"></div> <img src="/wp-content/uploads/2026/04/20260429-171055.png" alt="运动赛事" class="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105">
<i class="fa fa-futbol-o text-5xl text-green-400/40 group-hover:text-green-400/70 transition-colors duration-300 group-hover:scale-110 transform transition-transform"></i> <div class="absolute inset-0 bg-gradient-to-t from-[#0f172a]/75 via-[#0f172a]/20 to-transparent"></div>
</div> </div>
<div class="p-5"> <div class="p-5">
<h4 class="font-semibold text-white mb-2">运动赛事</h4> <h4 class="font-semibold text-white mb-2">运动赛事</h4>
@@ -1351,9 +1356,9 @@
</div> </div>
</div> </div>
<div class="hover-card group rounded-2xl overflow-hidden border border-gray-700/50 bg-[#0f172a]"> <div class="hover-card group rounded-2xl overflow-hidden border border-gray-700/50 bg-[#0f172a]">
<div class="h-40 bg-gradient-to-br from-orange-500/20 to-red-500/20 flex items-center justify-center relative overflow-hidden"> <div class="h-40 relative overflow-hidden bg-[#0f172a]">
<div class="absolute inset-0 circuit-pattern opacity-20"></div> <img src="/wp-content/uploads/2026/04/20260429-171059.png" alt="团建活动" class="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105">
<i class="fa fa-tree text-5xl text-orange-400/40 group-hover:text-orange-400/70 transition-colors duration-300 group-hover:scale-110 transform transition-transform"></i> <div class="absolute inset-0 bg-gradient-to-t from-[#0f172a]/75 via-[#0f172a]/20 to-transparent"></div>
</div> </div>
<div class="p-5"> <div class="p-5">
<h4 class="font-semibold text-white mb-2">团建活动</h4> <h4 class="font-semibold text-white mb-2">团建活动</h4>
contact.html
+18 -13
View File
@@ -253,7 +253,7 @@
@media (min-width: 768px) { @media (min-width: 768px) {
.contact-info-grid { .contact-info-grid {
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(3, 1fr);
} }
} }
@@ -277,25 +277,30 @@
<div class="bg-darkCard p-8 rounded-xl shadow-lg border border-gray-700"> <div class="bg-darkCard p-8 rounded-xl shadow-lg border border-gray-700">
<!-- 联系信息区域 --> <!-- 联系信息区域 -->
<div class="contact-info-grid mb-8 pb-8 border-b border-gray-700"> <div class="contact-info-grid mb-8 pb-8 border-b border-gray-700">
<!-- 华北地区 -->
<div class="contact-info-card flex items-start space-x-4"> <div class="contact-info-card flex items-start space-x-4">
<div class="w-12 h-12 bg-primary/10 rounded-full flex items-center justify-center flex-shrink-0">
<i class="fa fa-phone text-primary text-xl"></i>
</div>
<div> <div>
<h3 class="text-lg font-semibold text-white" style="margin: 0 0 8px 0 !important;">热线电话</h3> <h3 class="text-lg font-semibold text-white" style="margin: 0 0 8px 0 !important;">华北地区</h3>
<p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;">025-58181916</p> <p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;"><strong>商务代表：</strong>曹福利 | 13810554735</p>
<p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;">0755-86978994</p> <p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;"><strong>邮箱：</strong>Francis.Cao@wingsemitech.com</p>
</div> </div>
</div> </div>
<!-- 华南地区 -->
<div class="contact-info-card flex items-start space-x-4"> <div class="contact-info-card flex items-start space-x-4">
<div class="w-12 h-12 bg-primary/10 rounded-full flex items-center justify-center flex-shrink-0">
<i class="fa fa-user-o text-primary text-xl"></i>
</div>
<div> <div>
<h3 class="text-lg font-semibold text-white" style="margin: 0 0 8px 0 !important;">商务代表</h3> <h3 class="text-lg font-semibold text-white" style="margin: 0 0 8px 0 !important;">华南地区</h3>
<p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;">Jack 吴 | 17372837832</p> <p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;"><strong>商务代表：</strong>邓强 | 18566773662</p>
<p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;">jack.wu@wingsemitech.com</p> <p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;"><strong>邮箱：</strong>qiang.deng@wingsemitech.com</p>
</div>
</div>
<!-- 华东地区 -->
<div class="contact-info-card flex items-start space-x-4">
<div>
<h3 class="text-lg font-semibold text-white" style="margin: 0 0 8px 0 !important;">华东地区</h3>
<p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;"><strong>商务代表：</strong>Rock | 17821260088</p>
<p class="text-gray-400 text-base" style="margin: 0 !important; line-height: 1.6 !important;"><strong>邮箱：</strong>rock.chen@wingsemitech.com</p>
</div> </div>
</div> </div>
</div> </div>
index_new.html
+10 -40
View File
@@ -406,7 +406,7 @@
@keyframes scrollBounce { @keyframes scrollBounce {
0%, 100% { transform: translateY(0); } 0%, 100% { transform: translateY(0); }
50% { transform: translateY(10px); } 50% { transform: translateY(25px); }
} }
/* 流动边框 */ /* 流动边框 */
@@ -508,20 +508,20 @@
<!-- 核心数据展示 --> <!-- 核心数据展示 -->
<div class="grid grid-cols-2 md:grid-cols-4 gap-6 max-w-4xl mx-auto reveal reveal-delay-4"> <div class="grid grid-cols-2 md:grid-cols-4 gap-6 max-w-4xl mx-auto reveal reveal-delay-4">
<div class="text-center p-4"> <div class="text-center p-4">
<div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="30" data-suffix="+">0+</div> <div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="20" data-suffix="+">0+</div>
<div class="text-sm text-gray-400 mt-2">处理器IP型号</div> <div class="text-sm text-gray-400 mt-2">处理器IP型号</div>
</div> </div>
<div class="text-center p-4"> <div class="text-center p-4">
<div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="100" data-suffix="+">0+</div> <div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="30" data-suffix="+">0+</div>
<div class="text-sm text-gray-400 mt-2">知识产权</div> <div class="text-sm text-gray-400 mt-2">知识产权</div>
</div> </div>
<div class="text-center p-4"> <div class="text-center p-4">
<div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="10" data-suffix="x">0x</div> <div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="80" data-suffix="+">0+</div>
<div class="text-sm text-gray-400 mt-2">开发效率提升</div> <div class="text-sm text-gray-400 mt-2">专业技术人员</div>
</div> </div>
<div class="text-center p-4"> <div class="text-center p-4">
<div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-text="RVA23">RVA23</div> <div class="text-3xl sm:text-4xl font-bold gradient-text stat-number" data-target="8" data-suffix="+">0+</div>
<div class="text-sm text-gray-400 mt-2">规范兼容</div> <div class="text-sm text-gray-400 mt-2">行业解决方案</div>
</div> </div>
</div> </div>
</div> </div>
@@ -529,8 +529,8 @@
<!-- 滚动指示器 --> <!-- 滚动指示器 -->
<div class="absolute bottom-8 left-1/2 -translate-x-1/2 scroll-indicator"> <div class="absolute bottom-8 left-1/2 -translate-x-1/2 scroll-indicator">
<div class="flex flex-col items-center space-y-2 text-gray-500"> <div class="flex flex-col items-center space-y-2 text-gray-500">
<span class="text-xs">向下滚动</span> <span class="text-sm">向下滚动</span>
<i class="fa fa-chevron-down"></i> <i class="fa fa-chevron-down text-2xl"></i>
</div> </div>
</div> </div>
</section> </section>
@@ -973,7 +973,7 @@
<span class="text-sm text-gray-300">应用领域</span> <span class="text-sm text-gray-300">应用领域</span>
</div> </div>
<h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold text-white mb-4"> <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold text-white mb-4">
赋能<span class="gradient-text">千行百业</span> 赋能<span class="gradient-text">N个专用领域</span>
</h2> </h2>
<p class="text-gray-400 text-lg max-w-2xl mx-auto"> <p class="text-gray-400 text-lg max-w-2xl mx-auto">
隼瞻科技的处理器IP广泛应用于人工智能、通信、工业、安全等多个领域 隼瞻科技的处理器IP广泛应用于人工智能、通信、工业、安全等多个领域
@@ -1086,36 +1086,6 @@
</div> </div>
</section> </section>
<!-- ============================================ -->
<!-- CTA区域 -->
<!-- ============================================ -->
<section id="contact" class="py-24 relative overflow-hidden">
<!-- 背景 -->
<div class="absolute inset-0 bg-gradient-to-br from-primary/20 via-darkerBg to-purple-600/20"></div>
<div class="absolute inset-0 bg-[url('data:image/svg+xml,%3Csvg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cg fill=\"none\" fill-rule=\"evenodd\"%3E%3Cg fill=\"%233b82f6\" fill-opacity=\"0.05\"%3E%3Cpath d=\"M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z\"/%3E%3C/g%3E%3C/g%3E%3C/svg%3E')]"></div>
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center relative z-10">
<div class="reveal">
<h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold text-white mb-6">
准备好开启您的<span class="gradient-text">芯片创新之旅</span>了吗？
</h2>
<p class="text-gray-400 text-lg mb-10 max-w-2xl mx-auto">
联系我们，了解隼瞻科技如何帮助您加速芯片设计，降低开发成本
</p>
<div class="flex flex-col sm:flex-row items-center justify-center gap-4">
<a href="mailto:contact@wingsemi.com" class="btn-primary px-10 py-4 rounded-xl text-white font-semibold text-lg flex items-center space-x-2">
<i class="fa fa-envelope"></i>
<span>联系我们</span>
</a>
<a href="about" class="btn-secondary px-10 py-4 rounded-xl text-white font-semibold text-lg flex items-center space-x-2">
<i class="fa fa-info-circle"></i>
<span>了解更多</span>
</a>
</div>
</div>
</div>
</section>
<!-- JavaScript --> <!-- JavaScript -->
<script> <script>
// ====== 星座背景效果 ====== // ====== 星座背景效果 ======
interrupt_realtime_wingsemi.html
+41 -111
View File
@@ -222,7 +222,7 @@
<!-- 流程对比图表 --> <!-- 流程对比图表 -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-12 mb-16"> <div class="grid grid-cols-1 md:grid-cols-2 gap-12 mb-16">
<!-- 左侧：流程步骤对比 --> <!-- 左侧：流程步骤对比 -->
<div class="space-y-8"> <div class="flex flex-col justify-between space-y-8">
<div> <div>
<h4 class="text-dark-text mb-3 text-sm uppercase tracking-wider">常规中断处理步骤</h4> <h4 class="text-dark-text mb-3 text-sm uppercase tracking-wider">常规中断处理步骤</h4>
<div class="flex w-full text-xs md:text-sm text-center"> <div class="flex w-full text-xs md:text-sm text-center">
@@ -233,17 +233,29 @@
<div class="text-center mt-2 text-xs text-gray-500">串行执行，耗时累加</div> <div class="text-center mt-2 text-xs text-gray-500">串行执行，耗时累加</div>
</div> </div>
<div> <!-- 过渡图标 -->
<div class="flex justify-center items-center text-primary/40 space-x-6 py-2">
<i class="fa fa-angle-double-down text-3xl animate-bounce"></i>
<i class="fa fa-angle-double-down text-4xl animate-bounce" style="animation-delay: 0.15s"></i>
<i class="fa fa-angle-double-down text-3xl animate-bounce" style="animation-delay: 0.3s"></i>
</div>
<div class="pb-2">
<h4 class="text-primary mb-3 text-sm uppercase tracking-wider font-bold">隼瞻增强技术步骤</h4> <h4 class="text-primary mb-3 text-sm uppercase tracking-wider font-bold">隼瞻增强技术步骤</h4>
<div class="relative pt-6"> <div class="relative pt-6">
<!-- 连接线 --> <!-- 连接线 -->
<div class="flex w-full text-xs md:text-sm text-center relative z-10 font-medium"> <div class="flex w-full text-xs md:text-sm text-center relative z-10 font-medium">
<div class="bg-blue-500 py-3 px-1 w-1/2 rounded-l-lg border-r border-blue-400 text-white shadow-md">中断发起<br>跳转时间</div> <div class="bg-blue-500 py-3 px-1 w-1/3 rounded-l-lg border-r border-blue-400 text-white shadow-md">中断发起<br>跳转时间</div>
<div class="bg-sky-500 py-3 px-1 w-1/2 rounded-r-lg text-white shadow-md">向量中断、缩短<br>接入服务时间</div> <div class="bg-sky-500 py-3 px-1 w-1/3 rounded-r-lg text-white shadow-md">中断处理<br>时间</div>
<!-- 虚线框 补满最后的1/3空间 -->
<div class="w-1/3 ml-3 flex items-center justify-center border-2 border-dashed border-green-500/50 text-green-400 rounded-lg shadow-sm bg-green-500/10 p-1">
大幅减少<br>处理时间
</div>
</div> </div>
<!-- 并行块 --> <!-- 并行块 -->
<div class="absolute top-0 mt-8 right-0 w-1/2 h-full -z-0"> <div class="absolute top-0 mt-8 left-1/3 w-1/3 h-full -z-0">
<div class="absolute top-16 left-4 right-4 bg-cyan-400 border border-cyan-300 text-slate-900 font-bold py-2 rounded text-xs text-center shadow-lg"> <div class="absolute top-16 -left-4 -right-4 lg:-left-2 lg:-right-2 bg-cyan-400 border border-cyan-300 text-slate-900 font-bold py-2 rounded text-xs text-center shadow-lg">
<i class="fa fa-random mr-1"></i> 并行处理上下文切换 <i class="fa fa-random mr-1"></i> 并行处理上下文切换
</div> </div>
<!-- 箭头示意并行 --> <!-- 箭头示意并行 -->
@@ -253,115 +265,33 @@
</div> </div>
</div> </div>
<!-- 右侧：Cycle 数对比柱状图 --> <!-- 右侧：绝对时间优势卡片 -->
<div class="bg-dark-card p-6 rounded-xl border border-white/10 flex flex-col justify-center"> <div class="bg-dark-card p-6 flex flex-col justify-center rounded-xl border border-white/10 hover:border-primary/30 transition-colors">
<h3 class="text-xl font-bold mb-6">进入中断所需 Cycle 数对比</h3> <h3 class="text-2xl font-bold mb-6 flex items-center gap-3">
<i class="fa fa-clock-o text-primary"></i> 绝对时间优势
<div class="space-y-6"> </h3>
<!-- 常规 --> <div class="relative pt-10 pb-4">
<div> <div class="flex items-end justify-center gap-8 h-48">
<div class="flex justify-between text-sm mb-2"> <!-- 柱子1 -->
<span class="text-gray-400">常规中断处理</span> <div class="w-20 lg:w-24 group relative">
<span class="font-mono font-bold">26 Cycles</span> <div class="absolute -top-8 w-full text-center text-gray-400 font-mono">常规</div>
<div class="h-40 bg-gray-600 rounded-t-lg w-full relative"></div>
</div> </div>
<div class="w-full bg-gray-700 rounded-full h-4 overflow-hidden"> <!-- 柱子2 -->
<div class="bg-gray-500 h-full rounded-full" style="width: 100%"></div> <div class="w-20 lg:w-24 group relative">
</div> <div class="absolute -top-16 w-full text-center text-primary font-mono font-bold">增强版</div>
</div> <div class="h-16 bg-gradient-to-t from-primary to-secondary rounded-t-lg w-full relative shadow-[0_0_20px_rgba(54,207,201,0.4)]">
<div class="absolute -top-10 left-1/2 -translate-x-1/2 whitespace-nowrap text-secondary font-bold">
<!-- 隼瞻 --> -61.54%
<div class="relative"> </div>
<div class="flex justify-between text-sm mb-2"> <!-- 红色下降箭头 -->
<span class="text-white font-bold">隼瞻实时性增强技术</span> <div class="absolute -top-4 left-1/2 -translate-x-1/2 text-red-500">
<span class="font-mono font-bold text-primary">12 Cycles</span> ↓
</div> </div>
<div class="w-full bg-gray-700 rounded-full h-4 overflow-hidden">
<div class="bg-gradient-to-r from-primary to-secondary h-full rounded-full shadow-glow" style="width: 46%"></div>
</div>
<!-- 下降箭头指示 -->
<div class="absolute right-[30%] top-[-1.5rem] hidden md:flex flex-row items-center gap-2">
<div class="flex flex-col items-center">
<div class="h-8 w-0.5 bg-red-500/50"></div>
<i class="fa fa-caret-down text-red-500 text-xl"></i>
</div>
<span class="text-2xl font-bold pb-1 text-red-500">-53.85%</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 4. 实时性优势与确定性 (对应图片2) -->
<section class="section-padding bg-dark">
<div class="container mx-auto px-4">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">不仅更快，而且更稳</h2>
<p class="text-dark-text text-lg">同时达成 <span class="text-white font-bold">中断时延的确定性</span> 和 <span class="text-white font-bold">响应中断的及时性</span></p>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
<!-- 左侧：绝对时间优势 -->
<div class="bg-dark-card p-8 rounded-xl border border-white/10 hover:border-primary/30 transition-colors">
<h3 class="text-2xl font-bold mb-6 flex items-center gap-3">
<i class="fa fa-clock-o text-primary"></i> 绝对时间优势
</h3>
<div class="relative pt-10 pb-4">
<div class="flex items-end justify-center gap-8 h-48">
<!-- 柱子1 -->
<div class="w-24 group relative">
<div class="absolute -top-8 w-full text-center text-gray-400 font-mono">常规</div>
<div class="h-40 bg-gray-600 rounded-t-lg w-full relative"></div>
</div>
<!-- 柱子2 -->
<div class="w-24 group relative">
<div class="absolute -top-16 w-full text-center text-primary font-mono font-bold">增强版</div>
<div class="h-16 bg-gradient-to-t from-primary to-secondary rounded-t-lg w-full relative shadow-[0_0_20px_rgba(54,207,201,0.4)]">
<div class="absolute -top-10 left-1/2 -translate-x-1/2 whitespace-nowrap text-secondary font-bold">
-61.54%
</div>
<!-- 红色下降箭头 -->
<div class="absolute -top-4 left-1/2 -translate-x-1/2 text-red-500">
↓
</div> </div>
</div> </div>
</div> </div>
</div> <p class="text-center mt-6 text-gray-400 text-sm">中断响应周期大幅缩减</p>
<p class="text-center mt-6 text-gray-400 text-sm">中断响应周期大幅缩减</p>
</div>
</div>
<!-- 右侧：时间确定性 (Jitter对比) -->
<div class="bg-dark-card p-8 rounded-xl border border-white/10 hover:border-secondary/30 transition-colors">
<h3 class="text-2xl font-bold mb-6 flex items-center gap-3">
<i class="fa fa-line-chart text-secondary"></i> 时间确定性 (Jitter)
</h3>
<div class="space-y-8">
<!-- 隼瞻表现 -->
<div>
<div class="text-sm text-gray-400 mb-2">隼瞻中断实时性技术</div>
<div class="flex gap-1 h-12">
<div class="flex-1 bg-primary rounded flex items-center justify-center text-white font-bold text-xs shadow-lg">10 Cycle</div>
<div class="flex-1 bg-primary rounded flex items-center justify-center text-white font-bold text-xs shadow-lg">12 Cycle</div>
<div class="flex-1 bg-primary rounded flex items-center justify-center text-white font-bold text-xs shadow-lg">10 Cycle</div>
</div>
<div class="text-right text-xs text-secondary mt-1">波动极小，稳定可控</div>
</div>
<div class="text-center font-bold text-2xl text-gray-600 italic">VS</div>
<!-- 常规表现 -->
<div>
<div class="text-sm text-gray-400 mb-2">常规 RISC-V IP</div>
<div class="flex gap-1 h-12 items-end">
<div class="w-1/2 bg-gray-700 h-8 rounded flex items-center justify-center text-gray-400 text-xs">24 Cycle</div>
<div class="w-1/2 bg-gray-700 h-full rounded flex items-center justify-center text-gray-400 text-xs border border-red-500/30">40 Cycle</div>
</div>
<div class="text-right text-xs text-red-400 mt-1">波动巨大，不可预测</div>
</div> </div>
</div> </div>
</div> </div>
ip_matrix.html
+75 -99
View File
@@ -25,16 +25,17 @@
} }
</script> </script>
<style> <style>
body { /* 将原 body 样式迁移到独立容器以防止被 WordPress 主题覆盖 */
font-family: 'Inter', sans-serif; #ip-matrix-wrapper {
background: #0a0f1a; font-family: 'Inter', sans-serif !important;
color: #e2e8f0; background-color: #0a0f1a !important;
color: #e2e8f0 !important;
overflow-x: hidden; overflow-x: hidden;
} }
/* 网格背景 */ /* 网格背景 */
.grid-bg { .grid-bg {
position: fixed; position: absolute; /* 防止在WP中fixed导致遮挡其他内容 */
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
@@ -115,18 +116,10 @@
</head> </head>
<body class="antialiased"> <body class="antialiased">
<div class="grid-bg"></div> <!-- WordPress 隔离容器：解决主题层面的样式穿透导致颜色错乱的问题 -->
<div id="ip-matrix-wrapper" class="relative w-full min-h-screen bg-[#0a0f1a] text-[#e2e8f0]">
<!-- 顶部导航占位 (可替换为您原有的header) --> <div class="grid-bg"></div>
<header class="border-b border-white/10 bg-darkerBg/80 backdrop-blur-md sticky top-0 z-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 flex items-center justify-between">
<a href="index_new.html" class="flex items-center space-x-2 text-white hover:text-primary transition-colors">
<i class="fa fa-arrow-left"></i>
<span class="font-semibold">返回首页</span>
</a>
<div class="text-gray-300 font-medium">处理器 IP 货架集群</div>
</div>
</header>
<!-- 页面标题区 --> <!-- 页面标题区 -->
<section class="py-16 relative overflow-hidden"> <section class="py-16 relative overflow-hidden">
@@ -151,14 +144,14 @@
<span class="px-4 py-1.5 rounded-full bg-blue-500/10 text-blue-400 text-sm font-medium border border-blue-500/20">Wing-M & Wing-A 系列</span> <span class="px-4 py-1.5 rounded-full bg-blue-500/10 text-blue-400 text-sm font-medium border border-blue-500/20">Wing-M & Wing-A 系列</span>
</div> </div>
<div class="grid lg:grid-cols-2 gap-12"> <div class="grid lg:grid-cols-4 gap-12">
<!-- Wing-M 系列 (量产型/专用小核/中核) --> <!-- Wing-M 系列 (量产型/专用小核/中核) -->
<div> <div class="lg:col-span-3">
<h3 class="text-xl font-semibold text-emerald-400 mb-6 flex items-center"> <h3 class="text-xl font-semibold text-emerald-400 mb-6 flex items-center">
<i class="fa fa-microchip mr-3"></i> Wing-M 系列 (嵌入式/工控/安全) <i class="fa fa-microchip mr-3"></i> Wing-M 系列 (嵌入式/工控/安全)
</h3> </h3>
<div class="grid sm:grid-cols-2 gap-5"> <div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-5">
<a href="Wing-M050.html" class="model-card p-6 rounded-xl group"> <a href="/Wing-M050" class="model-card p-6 rounded-xl group">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-M050</h4> <h4 class="text-lg font-bold text-white">Wing-M050</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-emerald-500/20 text-emerald-400 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-emerald-500/20 text-emerald-400 flex items-center justify-center">
@@ -169,7 +162,7 @@
<div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> <div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a> </a>
<a href="Wing-M050s安全核.html" class="model-card p-6 rounded-xl group border-emerald-500/30"> <a href="/wing-m050s" class="model-card p-6 rounded-xl group border-emerald-500/30">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-M050s</h4> <h4 class="text-lg font-bold text-white">Wing-M050s</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-green-500/20 text-green-400 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-green-500/20 text-green-400 flex items-center justify-center">
@@ -180,7 +173,7 @@
<div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> <div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a> </a>
<a href="Wing-M130.html" class="model-card p-6 rounded-xl group"> <a href="/wing-m130" class="model-card p-6 rounded-xl group">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-M130</h4> <h4 class="text-lg font-bold text-white">Wing-M130</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-emerald-500/20 text-emerald-400 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-emerald-500/20 text-emerald-400 flex items-center justify-center">
@@ -191,7 +184,7 @@
<div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> <div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a> </a>
<a href="Wing-M130A.html" class="model-card p-6 rounded-xl group"> <a href="/wing-m130a" class="model-card p-6 rounded-xl group">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-M130A</h4> <h4 class="text-lg font-bold text-white">Wing-M130A</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-teal-500/20 text-teal-400 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-teal-500/20 text-teal-400 flex items-center justify-center">
@@ -201,16 +194,38 @@
<p class="text-sm text-gray-400 mb-4 flex-grow">在 M130 基础上增强 DSP 计算能力，适配轻量音频与信号处理。</p> <p class="text-sm text-gray-400 mb-4 flex-grow">在 M130 基础上增强 DSP 计算能力，适配轻量音频与信号处理。</p>
<div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> <div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a> </a>
<a href="/wing-m130s" class="model-card p-6 rounded-xl group border-emerald-500/30">
<div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-M130s</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-green-500/20 text-green-400 flex items-center justify-center">
<i class="fa fa-shield"></i>
</div>
</div>
<p class="text-sm text-gray-400 mb-4 flex-grow">专用加密安全中核，强化信息安全与加解密特性设计。</p>
<div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a>
<a href="/wing-m510" class="model-card p-6 rounded-xl group border-emerald-500/30">
<div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-M510</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-emerald-500/20 text-emerald-400 flex items-center justify-center">
<i class="fa fa-microchip"></i>
</div>
</div>
<p class="text-sm text-gray-400 mb-4 flex-grow">高性能多核处理器，满足复杂嵌入式与工业控制算力需求。</p>
<div class="text-emerald-400 text-sm font-medium flex items-center">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a>
</div> </div>
</div> </div>
<!-- Wing-A 系列 (通用大核) --> <!-- Wing-A 系列 (通用大核) -->
<div> <div class="lg:col-span-1">
<h3 class="text-xl font-semibold text-blue-400 mb-6 flex items-center"> <h3 class="text-xl font-semibold text-blue-400 mb-6 flex items-center">
<i class="fa fa-rocket mr-3"></i> Wing-A 系列 (通用大核/应用级) <i class="fa fa-rocket mr-3"></i> Wing-A 系列 （通用大核）
</h3> </h3>
<div class="grid sm:grid-cols-2 gap-5 h-[calc(100%-3rem)]"> <div class="flex flex-col gap-5 h-[calc(100%-3rem)]">
<a href="Wing-A500.html" class="model-card p-6 rounded-xl group"> <a href="/wing-a500" class="model-card p-6 rounded-xl group flex-grow">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-A500</h4> <h4 class="text-lg font-bold text-white">Wing-A500</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-blue-500/20 text-blue-400 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-blue-500/20 text-blue-400 flex items-center justify-center">
@@ -220,17 +235,6 @@
<p class="text-sm text-gray-400 mb-4 flex-grow">支持 RVA23 规范的双发射9级流水线大核，覆盖 AP 与端侧 AI。</p> <p class="text-sm text-gray-400 mb-4 flex-grow">支持 RVA23 规范的双发射9级流水线大核，覆盖 AP 与端侧 AI。</p>
<div class="text-blue-400 text-sm font-medium flex items-center mt-auto">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> <div class="text-blue-400 text-sm font-medium flex items-center mt-auto">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a> </a>
<a href="Wing-A700.html" class="model-card p-6 rounded-xl group">
<div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-A700</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-indigo-500/20 text-indigo-400 flex items-center justify-center">
<i class="fa fa-server"></i>
</div>
</div>
<p class="text-sm text-gray-400 mb-4 flex-grow">更高性能的 64 位多核强劲算力引擎，专为高性能服务器及大算力平台设计。</p>
<div class="text-indigo-400 text-sm font-medium flex items-center mt-auto">查看详情 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div>
</a>
</div> </div>
</div> </div>
</div> </div>
@@ -245,27 +249,25 @@
<div class="grid sm:grid-cols-2 lg:grid-cols-4 gap-6"> <div class="grid sm:grid-cols-2 lg:grid-cols-4 gap-6">
<a href="#" class="model-card p-6 rounded-xl group border-cyan-500/20"> <div class="model-card p-6 rounded-xl group border-cyan-500/20 cursor-default">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-D200</h4> <h4 class="text-lg font-bold text-white">Wing-D200</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-cyan-500/20 text-cyan-400 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-cyan-500/20 text-cyan-400 flex items-center justify-center">
<i class="fa fa-wifi"></i> <i class="fa fa-wifi"></i>
</div> </div>
</div> </div>
<p class="text-sm text-gray-400 mb-4 flex-grow">专用矢量处理器，聚焦 5G 通信核心场景与高频信号处理。</p> <p class="text-sm text-gray-400 my-auto">专用矢量处理器，聚焦 5G 通信核心场景与高频信号处理。</p>
<div class="text-cyan-400 text-sm font-medium flex items-center">探索设备 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> </div>
</a>
<a href="#" class="model-card p-6 rounded-xl group border-cyan-500/20"> <div class="model-card p-6 rounded-xl group border-cyan-500/20 cursor-default">
<div class="flex justify-between items-start mb-4"> <div class="flex justify-between items-start mb-4">
<h4 class="text-lg font-bold text-white">Wing-D400-VL</h4> <h4 class="text-lg font-bold text-white">Wing-D400-VL</h4>
<div class="icon-wrapper w-8 h-8 rounded-lg bg-cyan-600/20 text-cyan-500 flex items-center justify-center"> <div class="icon-wrapper w-8 h-8 rounded-lg bg-cyan-600/20 text-cyan-500 flex items-center justify-center">
<i class="fa fa-headphones"></i> <i class="fa fa-headphones"></i>
</div> </div>
</div> </div>
<p class="text-sm text-gray-400 mb-4 flex-grow">强化版矢量处理器，同时完美适配轻量级 AI 运算与 HIFI 音频处理。</p> <p class="text-sm text-gray-400 my-auto">强化版矢量处理器，同时完美适配轻量级 AI 运算与 HIFI 音频处理。</p>
<div class="text-cyan-400 text-sm font-medium flex items-center">探索设备 <i class="fa fa-angle-right ml-2 group-hover:translate-x-1 transition-transform"></i></div> </div>
</a>
<!-- 场景介绍占位卡片 --> <!-- 场景介绍占位卡片 -->
<div class="lg:col-span-2 p-6 rounded-xl bg-gradient-to-br from-cyan-900/20 to-transparent border border-cyan-500/10 flex flex-col justify-center"> <div class="lg:col-span-2 p-6 rounded-xl bg-gradient-to-br from-cyan-900/20 to-transparent border border-cyan-500/10 flex flex-col justify-center">
@@ -277,73 +279,47 @@
</div> </div>
</section> </section>
<!-- ================= NPU IP 板块 ================= --> <!-- ================= DSP IP 板块 ================= -->
<section> <section>
<div class="flex items-center justify-between mb-8 pb-4 border-b border-white/10"> <div class="flex items-center justify-between mb-8 pb-4 border-b border-white/10">
<h2 class="text-3xl font-bold text-white category-header !border-purple-500">NPU IP (神经网络处理器)</h2> <h2 class="text-3xl font-bold text-white category-header !border-cyan-500">NPU IP (神经网络处理器)</h2>
<span class="px-4 py-1.5 rounded-full bg-purple-500/10 text-purple-400 text-sm font-medium border border-purple-500/20">Wing-N / P / M 系列</span> <span class="px-4 py-1.5 rounded-full bg-purple-500/10 text-purple-400 text-sm font-medium border border-cyan-500/20">Nexus 系列</span>
</div> </div>
<div class="grid sm:grid-cols-3 gap-6"> <div class="grid sm:grid-cols-2 lg:grid-cols-4 gap-6">
<!-- 端侧 -->
<a href="#" class="model-card p-6 rounded-xl group border-purple-500/20">
<div class="flex justify-between items-start mb-6">
<div>
<span class="text-xs font-bold text-purple-400 uppercase tracking-wider mb-1 block">端侧 AI</span>
<h4 class="text-xl font-bold text-white">0 - 4T 算力</h4>
</div>
<div class="icon-wrapper w-10 h-10 rounded-xl bg-purple-500/20 text-purple-400 flex items-center justify-center text-xl">
<i class="fa fa-cogs"></i>
</div>
</div>
<p class="text-sm text-gray-400 mb-6 flex-grow">
覆盖各类 IoT 设备、智能家居、可穿戴设备。极低待机功耗，支持实时唤醒与本地小模型推理。
</p>
<div class="pt-4 border-t border-white/5 text-purple-400 text-sm font-medium flex items-center font-mono">
Wing-M 系列 <i class="fa fa-angle-right ml-auto group-hover:translate-x-1 transition-transform"></i>
</div>
</a>
<!-- 边缘侧 --> <div class="model-card p-6 rounded-xl group border-cyan-500/20 cursor-default">
<a href="#" class="model-card p-6 rounded-xl group border-fuchsia-500/20"> <div class="flex justify-between items-start mb-4">
<div class="flex justify-between items-start mb-6"> <h4 class="text-lg font-bold text-white">Nexus N100</h4>
<div> <div class="icon-wrapper w-8 h-8 rounded-lg bg-purple-500/20 text-purple-400 flex items-center justify-center">
<span class="text-xs font-bold text-fuchsia-400 uppercase tracking-wider mb-1 block">边缘 AI</span> <i class="fa fa-cube"></i>
<h4 class="text-xl font-bold text-white">4 - 64T 算力</h4>
</div>
<div class="icon-wrapper w-10 h-10 rounded-xl bg-fuchsia-500/20 text-fuchsia-400 flex items-center justify-center text-xl">
<i class="fa fa-car"></i>
</div> </div>
</div> </div>
<p class="text-sm text-gray-400 mb-6 flex-grow"> <p class="text-sm text-gray-400 my-auto">算力0.1-0.5T低功耗神经网络处理器，可用于物体检测、指纹、声纹检测等应用场景</p>
适用于智能汽车、安防监控前端、服务器边缘端节点。提供极高能效比的大规模张量加速。 </div>
</p>
<div class="pt-4 border-t border-white/5 text-fuchsia-400 text-sm font-medium flex items-center font-mono">
Wing-P 系列 <i class="fa fa-angle-right ml-auto group-hover:translate-x-1 transition-transform"></i>
</div>
</a>
<!-- 云端 --> <div class="model-card p-6 rounded-xl group border-cyan-500/20 cursor-default">
<a href="#" class="model-card p-6 rounded-xl group border-pink-500/20"> <div class="flex justify-between items-start mb-4">
<div class="flex justify-between items-start mb-6"> <h4 class="text-lg font-bold text-white">Nexus P100</h4>
<div> <div class="icon-wrapper w-8 h-8 rounded-lg bg-purple-600/20 text-purple-400 flex items-center justify-center">
<span class="text-xs font-bold text-pink-400 uppercase tracking-wider mb-1 block">云端 AI</span> <i class="fa fa-eye"></i>
<h4 class="text-xl font-bold text-white">> 200T 算力</h4>
</div>
<div class="icon-wrapper w-10 h-10 rounded-xl bg-pink-500/20 text-pink-400 flex items-center justify-center text-xl">
<i class="fa fa-cloud"></i>
</div> </div>
</div> </div>
<p class="text-sm text-gray-400 mb-6 flex-grow"> <p class="text-sm text-gray-400 my-auto">算力0.5-4T低功耗神经网络处理器，可用于人脸识别、手势识别等应用场景</p>
针对大数据平台、服务器集群与大模型训练/推理定制，具备高度可扩展的多芯多卡级联能力。 </div>
<!-- 场景介绍占位卡片 -->
<div class="lg:col-span-2 p-6 rounded-xl bg-gradient-to-br from-cyan-900/20 to-transparent border border-cyan-500/10 flex flex-col justify-center">
<h4 class="text-lg font-bold text-white mb-2 flex items-center"><i class="fa fa-crosshairs text-cyan-500 mr-2"></i> 精准高效的专用架构</h4>
<p class="text-sm text-gray-400 leading-relaxed">
高度可定制的AI加速引擎：Nexus系列神经网络处理器核心是一款领域专用的可扩展AI加速引擎，专为在边缘端与终端设备上高效运行复杂的神经网络模型而设计，支持16-2048个MAC阵列配置，算力涵盖0.1-4T，支持CNN、RNN等主流模型，并提供内存层次、数据位宽，专用AI算子的深度定制，配套易用的软件工具链，满足从超低功耗IoT感知到高性能边缘推理的全场景需求。
</p> </p>
<div class="pt-4 border-t border-white/5 text-pink-400 text-sm font-medium flex items-center font-mono"> </div>
Wing-N 系列 <i class="fa fa-angle-right ml-auto group-hover:translate-x-1 transition-transform"></i>
</div>
</a>
</div> </div>
</section> </section>
</main> </main>
</div> <!-- 结束 WordPress 隔离容器 -->
</body> </body>
</html> </html>
pdf-preview-site/README.md
+91
View File
@@ -0,0 +1,91 @@
# PDF 预览系统 (PDF Preview Site)
这是一个安全、现代化的 PDF 预览系统，具有管理员后台和公共预览功能。
## 🖥 本地开发
前后端分开运行：
```bash
# 终端 1：启动后端（API 服务）
cd backend && npm install && npm start
# → http://localhost:3000
# 终端 2：启动前端（开发服务器，支持热更新）
cd frontend && npm install && npm run dev
# → http://localhost:5173
```
## 📦 打包 & 部署到服务器
只需要上传 `backend` 文件夹即可，步骤如下：
### 第一步：在本地打包前端
```bash
cd frontend
npm run build
```
执行后，前端产物会自动输出到 `backend/public/` 目录中。
### 第二步：上传 backend 文件夹到服务器
将整个 `backend/` 文件夹上传到服务器（通过 FTP/SCP/Git 均可）。
> [!IMPORTANT]
> 上传时注意包含以下内容：
> - `backend/public/`（前端打包产物，刚才 build 生成的）
> - `backend/uploads/`（已上传的 PDF 文件）
> - `backend/database.sqlite`（数据库文件，包含管理员账号和文档记录）
>
> 可以把 `backend/node_modules/` 排除，在服务器上重新 `npm install` 即可。
### 第三步：在服务器上启动
```bash
cd backend
npm install # 仅首次或依赖变更时需要
npm start # 启动服务
```
访问 `http://服务器IP:3000` 即可看到网站，**前后端都由这一个进程提供服务**。
### 第四步（推荐）：用 PM2 长期运行
```bash
npm install pm2 -g # 全局安装 PM2（仅首次）
pm2 start server.js --name pdf-site # 后台启动
pm2 save && pm2 startup # 设置开机自启
```
常用管理命令：
```bash
pm2 status # 查看运行状态
pm2 logs pdf-site # 查看日志
pm2 restart pdf-site # 重启服务
```
## 🔐 管理后台
- **后台地址**: `http://服务器IP:3000/admin`
- **默认用户名**: `admin`
- **默认密码**: `123456`
> [!WARNING]
> 生产环境请务必修改默认密码！详见修改方法：在 `backend` 目录运行以下命令（替换新用户名/密码）：
> ```bash
> node -e "const db=require('./database');const bcrypt=require('bcryptjs');const h=bcrypt.hashSync('新密码',10);db.prepare('UPDATE users SET username=?,password=? WHERE id=1').run('新用户名',h);console.log('已更新');"
> ```
## 🛠 技术栈
- **前端**: Vue 3 + Vite + Glassmorphism UI
- **后端**: Node.js + Express（同时托管前端静态文件）
- **数据库**: SQLite (better-sqlite3)
- **PDF 处理**: 提取前两页进行预览
## 📁 目录结构
- `/frontend`: Vue 3 源码（本地开发用，部署后不需要上传）
- `/backend`: Node.js 服务 + 前端打包产物（部署只需上传这个）
- `/backend/public/`: 前端 build 产物（由 `npm run build` 自动生成）
- `/backend/database.sqlite`: 存储文档信息和管理员账号
pdf-preview-site/backend/backend.zip
BIN
View File
Binary file not shown.
pdf-preview-site/backend/database.sqlite
BIN
View File
Binary file not shown.
pdf-preview-site/backend/package.json
+1
View File
@@ -4,6 +4,7 @@
"description": "", "description": "",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {
"start": "node server.js",
"test": "echo \"Error: no test specified\" && exit 1" "test": "echo \"Error: no test specified\" && exit 1"
}, },
"keywords": [], "keywords": [],
pdf-preview-site/backend/public/assets/index-CBnsKpxD.js
+386
View File
File diff suppressed because one or more lines are too long
pdf-preview-site/backend/public/assets/index-DG_v3cGl.css
+1
View File
File diff suppressed because one or more lines are too long
pdf-preview-site/backend/public/favicon.svg
+1
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 9.3 KiB

pdf-preview-site/backend/public/icons.svg
+24
View File
@@ -0,0 +1,24 @@
<svg xmlns="http://www.w3.org/2000/svg">
<symbol id="bluesky-icon" viewBox="0 0 16 17">
<g clip-path="url(#bluesky-clip)"><path fill="#08060d" d="M7.75 7.735c-.693-1.348-2.58-3.86-4.334-5.097-1.68-1.187-2.32-.981-2.74-.79C.188 2.065.1 2.812.1 3.251s.241 3.602.398 4.13c.52 1.744 2.367 2.333 4.07 2.145-2.495.37-4.71 1.278-1.805 4.512 3.196 3.309 4.38-.71 4.987-2.746.608 2.036 1.307 5.91 4.93 2.746 2.72-2.746.747-4.143-1.747-4.512 1.702.189 3.55-.4 4.07-2.145.156-.528.397-3.691.397-4.13s-.088-1.186-.575-1.406c-.42-.19-1.06-.395-2.741.79-1.755 1.24-3.64 3.752-4.334 5.099"/></g>
<defs><clipPath id="bluesky-clip"><path fill="#fff" d="M.1.85h15.3v15.3H.1z"/></clipPath></defs>
</symbol>
<symbol id="discord-icon" viewBox="0 0 20 19">
<path fill="#08060d" d="M16.224 3.768a14.5 14.5 0 0 0-3.67-1.153c-.158.286-.343.67-.47.976a13.5 13.5 0 0 0-4.067 0c-.128-.306-.317-.69-.476-.976A14.4 14.4 0 0 0 3.868 3.77C1.546 7.28.916 10.703 1.231 14.077a14.7 14.7 0 0 0 4.5 2.306q.545-.748.965-1.587a9.5 9.5 0 0 1-1.518-.74q.191-.14.372-.293c2.927 1.369 6.107 1.369 8.999 0q.183.152.372.294-.723.437-1.52.74.418.838.963 1.588a14.6 14.6 0 0 0 4.504-2.308c.37-3.911-.63-7.302-2.644-10.309m-9.13 8.234c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.894 0 1.614.82 1.599 1.82.001 1-.705 1.82-1.6 1.82m5.91 0c-.878 0-1.599-.82-1.599-1.82 0-.998.705-1.82 1.6-1.82.893 0 1.614.82 1.599 1.82 0 1-.706 1.82-1.6 1.82"/>
</symbol>
<symbol id="documentation-icon" viewBox="0 0 21 20">
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="m15.5 13.333 1.533 1.322c.645.555.967.833.967 1.178s-.322.623-.967 1.179L15.5 18.333m-3.333-5-1.534 1.322c-.644.555-.966.833-.966 1.178s.322.623.966 1.179l1.534 1.321"/>
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M17.167 10.836v-4.32c0-1.41 0-2.117-.224-2.68-.359-.906-1.118-1.621-2.08-1.96-.599-.21-1.349-.21-2.848-.21-2.623 0-3.935 0-4.983.369-1.684.591-3.013 1.842-3.641 3.428C3 6.449 3 7.684 3 10.154v2.122c0 2.558 0 3.838.706 4.726q.306.383.713.671c.76.536 1.79.64 3.581.66"/>
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M3 10a2.78 2.78 0 0 1 2.778-2.778c.555 0 1.209.097 1.748-.047.48-.129.854-.503.982-.982.145-.54.048-1.194.048-1.749a2.78 2.78 0 0 1 2.777-2.777"/>
</symbol>
<symbol id="github-icon" viewBox="0 0 19 19">
<path fill="#08060d" fill-rule="evenodd" d="M9.356 1.85C5.05 1.85 1.57 5.356 1.57 9.694a7.84 7.84 0 0 0 5.324 7.44c.387.079.528-.168.528-.376 0-.182-.013-.805-.013-1.454-2.165.467-2.616-.935-2.616-.935-.349-.91-.864-1.143-.864-1.143-.71-.48.051-.48.051-.48.787.051 1.2.805 1.2.805.695 1.194 1.817.857 2.268.649.064-.507.27-.857.49-1.052-1.728-.182-3.545-.857-3.545-3.87 0-.857.31-1.558.8-2.104-.078-.195-.349-1 .077-2.078 0 0 .657-.208 2.14.805a7.5 7.5 0 0 1 1.946-.26c.657 0 1.328.092 1.946.26 1.483-1.013 2.14-.805 2.14-.805.426 1.078.155 1.883.078 2.078.502.546.799 1.247.799 2.104 0 3.013-1.818 3.675-3.558 3.87.284.247.528.714.528 1.454 0 1.052-.012 1.896-.012 2.156 0 .208.142.455.528.377a7.84 7.84 0 0 0 5.324-7.441c.013-4.338-3.48-7.844-7.773-7.844" clip-rule="evenodd"/>
</symbol>
<symbol id="social-icon" viewBox="0 0 20 20">
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M12.5 6.667a4.167 4.167 0 1 0-8.334 0 4.167 4.167 0 0 0 8.334 0"/>
<path fill="none" stroke="#aa3bff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.35" d="M2.5 16.667a5.833 5.833 0 0 1 8.75-5.053m3.837.474.513 1.035c.07.144.257.282.414.309l.93.155c.596.1.736.536.307.965l-.723.73a.64.64 0 0 0-.152.531l.207.903c.164.715-.213.991-.84.618l-.872-.52a.63.63 0 0 0-.577 0l-.872.52c-.624.373-1.003.094-.84-.618l.207-.903a.64.64 0 0 0-.152-.532l-.723-.729c-.426-.43-.289-.864.306-.964l.93-.156a.64.64 0 0 0 .412-.31l.513-1.034c.28-.562.735-.562 1.012 0"/>
</symbol>
<symbol id="x-icon" viewBox="0 0 19 19">
<path fill="#08060d" fill-rule="evenodd" d="M1.893 1.98c.052.072 1.245 1.769 2.653 3.77l2.892 4.114c.183.261.333.48.333.486s-.068.089-.152.183l-.522.593-.765.867-3.597 4.087c-.375.426-.734.834-.798.905a1 1 0 0 0-.118.148c0 .01.236.017.664.017h.663l.729-.83c.4-.457.796-.906.879-.999a692 692 0 0 0 1.794-2.038c.034-.037.301-.34.594-.675l.551-.624.345-.392a7 7 0 0 1 .34-.374c.006 0 .93 1.306 2.052 2.903l2.084 2.965.045.063h2.275c1.87 0 2.273-.003 2.266-.021-.008-.02-1.098-1.572-3.894-5.547-2.013-2.862-2.28-3.246-2.273-3.266.008-.019.282-.332 2.085-2.38l2-2.274 1.567-1.782c.022-.028-.016-.03-.65-.03h-.674l-.3.342a871 871 0 0 1-1.782 2.025c-.067.075-.405.458-.75.852a100 100 0 0 1-.803.91c-.148.172-.299.344-.99 1.127-.304.343-.32.358-.345.327-.015-.019-.904-1.282-1.976-2.808L6.365 1.85H1.8zm1.782.91 8.078 11.294c.772 1.08 1.413 1.973 1.425 1.984.016.017.241.02 1.05.017l1.03-.004-2.694-3.766L7.796 5.75 5.722 2.852l-1.039-.004-1.039-.004z" clip-rule="evenodd"/>
</symbol>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

pdf-preview-site/backend/public/index.html
+14
View File
@@ -0,0 +1,14 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>frontend</title>
<script type="module" crossorigin src="/assets/index-CBnsKpxD.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-DG_v3cGl.css">
</head>
<body>
<div id="app"></div>
</body>
</html>
pdf-preview-site/backend/server.js
+25 -4
View File
@@ -15,6 +15,8 @@ const JWT_SECRET = 'super-secret-key-pdf-preview';
app.use(cors()); app.use(cors());
app.use(express.json()); app.use(express.json());
app.use('/uploads/processed', express.static(path.join(__dirname, 'uploads/processed'))); app.use('/uploads/processed', express.static(path.join(__dirname, 'uploads/processed')));
// Serve the built frontend from the public folder
app.use(express.static(path.join(__dirname, 'public')));
// Ensure upload directories exist // Ensure upload directories exist
const uploadDirOrig = path.join(__dirname, 'uploads/original'); const uploadDirOrig = path.join(__dirname, 'uploads/original');
@@ -24,7 +26,8 @@ if (!fs.existsSync(uploadDirProc)) fs.mkdirSync(uploadDirProc, { recursive: true
const storage = multer.diskStorage({ const storage = multer.diskStorage({
destination: function (req, file, cb) { destination: function (req, file, cb) {
cb(null, 'uploads/original/'); // 使用绝对路径，避免服务器 CWD 不在项目目录时写入失败
cb(null, path.join(__dirname, 'uploads/original/'));
}, },
filename: function (req, file, cb) { filename: function (req, file, cb) {
const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9); const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9);
@@ -79,7 +82,13 @@ app.post('/api/admin/upload', authenticateJWT, upload.single('document'), async
res.json({ message: 'Upload successful', documentId: info.lastInsertRowid }); res.json({ message: 'Upload successful', documentId: info.lastInsertRowid });
} catch (error) { } catch (error) {
res.status(500).json({ message: 'Error processing PDF', error: error.toString() }); // 输出完整堆栈到服务器日志，便于排查
console.error('Upload error details:', error.stack || error);
res.status(500).json({
message: 'Error processing PDF',
error: error.message || error.toString(),
stack: process.env.NODE_ENV !== 'production' ? error.stack : undefined
});
} }
}); });
@@ -105,7 +114,7 @@ app.get('/api/documents', (req, res) => {
id: doc.id, id: doc.id,
title: doc.title, title: doc.title,
created_at: doc.created_at, created_at: doc.created_at,
url: `http://localhost:3000/${doc.processed_path}` url: `/${doc.processed_path}`
})); }));
res.json(responseData); res.json(responseData);
}); });
@@ -119,10 +128,22 @@ app.get('/api/documents/:id', (req, res) => {
id: doc.id, id: doc.id,
title: doc.title, title: doc.title,
created_at: doc.created_at, created_at: doc.created_at,
url: `http://localhost:3000/${doc.processed_path}` url: `/${doc.processed_path}`
}); });
}); });
app.listen(PORT, () => { app.listen(PORT, () => {
console.log(`Backend server running on http://localhost:${PORT}`); console.log(`Backend server running on http://localhost:${PORT}`);
}); });
// SPA fallback: must be after all API routes so Vue Router can handle client-side routing
// Note: app.use() (not app.get('*')) is required for Express 5 compatibility
app.use((req, res) => {
const indexPath = path.join(__dirname, 'public', 'index.html');
if (fs.existsSync(indexPath)) {
res.sendFile(indexPath);
} else {
res.status(404).send('Frontend not built yet. Run: cd frontend && npm run build');
}
});
pdf-preview-site/backend/uploads/original/1777380559691-115513003.pdf
BIN
View File
Binary file not shown.
pdf-preview-site/backend/uploads/processed/processed-1777380559691-115513003.pdf
BIN
View File
Binary file not shown.
pdf-preview-site/frontend/.env.development
+2
View File
@@ -0,0 +1,2 @@
# 开发环境：前后端分离，后端运行在 3000 端口
VITE_API_BASE_URL=http://localhost:3000
pdf-preview-site/frontend/.env.production
+2
View File
@@ -0,0 +1,2 @@
# 生产环境：前端由后端托管，API 使用相对路径（空字符串即可）
VITE_API_BASE_URL=
pdf-preview-site/frontend/README.md
+23 -3
View File
@@ -1,5 +1,25 @@
# Vue 3 + Vite # PDF 预览系统 - 前端 (Frontend)
This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more. 这是基于 Vue 3 和 Vite 构建的现代化前端界面。
Learn more about IDE Support for Vue in the [Vue Docs Scaling up Guide](https://vuejs.org/guide/scaling-up/tooling.html#ide-support). ## 🔐 管理员入口
如果你想进入管理后台：
- **地址**: 访问网站首页并在 URL 后添加 `/admin` (例如: `http://localhost:5173/admin`)
- **账号**: `admin`
- **密码**: `123456`
## 🛠 常用命令
```bash
# 安装依赖
npm install
# 启动开发服务器
npm run dev
# 构建生产版本
npm run build
```
有关完整项目说明，请参阅根目录下的 [README.md](../README.md)。
pdf-preview-site/frontend/frontend.zip
BIN
View File
Binary file not shown.
pdf-preview-site/frontend/src/views/Admin.vue
+6 -4
View File
@@ -61,6 +61,8 @@
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import axios from 'axios'; import axios from 'axios';
const API = import.meta.env.VITE_API_BASE_URL;
const isLoggedIn = ref(false); const isLoggedIn = ref(false);
const username = ref(''); const username = ref('');
const password = ref(''); const password = ref('');
@@ -82,7 +84,7 @@ onMounted(() => {
const handleLogin = async () => { const handleLogin = async () => {
try { try {
const res = await axios.post('http://localhost:3000/api/admin/login', { const res = await axios.post(`${API}/api/admin/login`, {
username: username.value, username: username.value,
password: password.value password: password.value
}); });
@@ -102,7 +104,7 @@ const logout = () => {
const fetchDocs = async () => { const fetchDocs = async () => {
try { try {
const res = await axios.get('http://localhost:3000/api/documents'); const res = await axios.get(`${API}/api/documents`);
documents.value = res.data; documents.value = res.data;
} catch (e) { } catch (e) {
console.error("Failed to load documents"); console.error("Failed to load documents");
@@ -122,7 +124,7 @@ const handleUpload = async () => {
try { try {
const token = localStorage.getItem('admin_token'); const token = localStorage.getItem('admin_token');
await axios.post('http://localhost:3000/api/admin/upload', formData, { await axios.post(`${API}/api/admin/upload`, formData, {
headers: { headers: {
'Content-Type': 'multipart/form-data', 'Content-Type': 'multipart/form-data',
'Authorization': `Bearer ${token}` 'Authorization': `Bearer ${token}`
@@ -145,7 +147,7 @@ const deleteDoc = async (id) => {
if(!confirm("确定要执行此操作吗？")) return; if(!confirm("确定要执行此操作吗？")) return;
try { try {
const token = localStorage.getItem('admin_token'); const token = localStorage.getItem('admin_token');
await axios.delete(`http://localhost:3000/api/admin/documents/${id}`, { await axios.delete(`${API}/api/admin/documents/${id}`, {
headers: { 'Authorization': `Bearer ${token}` } headers: { 'Authorization': `Bearer ${token}` }
}); });
fetchDocs(); fetchDocs();
pdf-preview-site/frontend/src/views/Home.vue
+2 -1
View File
@@ -31,10 +31,11 @@ import axios from 'axios';
const documents = ref([]); const documents = ref([]);
const loading = ref(true); const loading = ref(true);
const router = useRouter(); const router = useRouter();
const API = import.meta.env.VITE_API_BASE_URL;
onMounted(async () => { onMounted(async () => {
try { try {
const res = await axios.get('http://localhost:3000/api/documents'); const res = await axios.get(`${API}/api/documents`);
documents.value = res.data; documents.value = res.data;
} catch (error) { } catch (error) {
console.error("Error fetching docs", error); console.error("Error fetching docs", error);
pdf-preview-site/frontend/src/views/Preview.vue
+8 -2
View File
@@ -27,12 +27,18 @@ const router = useRouter();
const document = ref(null); const document = ref(null);
const loading = ref(true); const loading = ref(true);
const error = ref(''); const error = ref('');
const API = import.meta.env.VITE_API_BASE_URL;
onMounted(async () => { onMounted(async () => {
try { try {
const id = route.params.id; const id = route.params.id;
const res = await axios.get(`http://localhost:3000/api/documents/${id}`); const res = await axios.get(`${API}/api/documents/${id}`);
document.value = res.data; // 将相对路径拼接为完整 URL，解决开发模式下跨端口访问问题
const data = res.data;
if (data.url && data.url.startsWith('/')) {
data.url = `${API}${data.url}`;
}
document.value = data;
} catch (err) { } catch (err) {
error.value = "文档未找到或无法访问。"; error.value = "文档未找到或无法访问。";
} finally { } finally {
pdf-preview-site/frontend/vite.config.js
+5
View File
@@ -4,4 +4,9 @@ import vue from '@vitejs/plugin-vue'
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig({
plugins: [vue()], plugins: [vue()],
build: {
// Build output goes directly into the backend's public folder
outDir: '../backend/public',
emptyOutDir: true,
},
}) })