文件
nahaichuan/addons/official/view/web/official_home/index_e.html

552 行
25 KiB
HTML

此文件含有模棱两可的 Unicode 字符

此文件含有可能会与其他字符混淆的 Unicode 字符。 如果您是想特意这样的,可以安全地忽略该警告。 使用 Escape 按钮显示他们。

{extend name="web/official_common/mobile/base" /}
{block name="css"}
<style>
/* 移动端特定微调 */
.nhc-hero {
padding-top: 100px;
padding-bottom: 50px;
}
.nhc-hero-title {
font-size: 28px;
letter-spacing: 1px;
}
.nhc-hero-subtitle {
font-size: 14px;
}
</style>
{/block}
{block name="content"}
<!-- 纳海川移动端 首页主体 开始 -->
<!-- 1. 高端全景首屏轮播图 (Mobile Hero Carousel) -->
<section class="nhc-hero-carousel-wrap nhc-lattice-pattern">
<div class="nhc-carousel" id="nhcHeroCarousel">
<div class="nhc-carousel-track">
<!-- 幻灯片 1:领航篇 -->
<div class="nhc-carousel-slide nhc-slide-theme-1 active" data-slide-index="0">
<div class="nhc-container">
<div class="nhc-hero-content">
<div class="nhc-hero-badge">
<span class="nhc-seal">纳海川</span>
<span class="nhc-hero-badge-text">现代企业数字化底座与智能体定制专家</span>
</div>
<h1 class="nhc-hero-title">
海纳百川以成巨流 <br><span class="highlight">聚智能</span>以启新元
</h1>
<p class="nhc-hero-subtitle">
纳海川专注于为政企与高成长型企业构筑稳固的业务技术中台、全端移动生态与垂直领域 AI 智能体体系。
</p>
<div class="nhc-hero-cta">
<a href="#contact" class="nhc-btn nhc-btn-primary">
<span>预约专家咨询</span>
</a>
<a href="#products" class="nhc-btn nhc-btn-outline">
<span>浏览核心产品</span>
</a>
</div>
<div class="nhc-hero-metrics">
<div class="nhc-metric-item">
<div class="nhc-metric-val">99.8<sub>%</sub></div>
<div class="nhc-metric-label">项目按期交付率</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">50<sub>+</sub></div>
<div class="nhc-metric-label">自主软著资产</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">200<sub>+</sub></div>
<div class="nhc-metric-label">政企标杆客户</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">10<sub>+</sub></div>
<div class="nhc-metric-label">年软件工程沉淀</div>
</div>
</div>
</div>
</div>
</div>
<!-- 幻灯片 2:匠造篇 -->
<div class="nhc-carousel-slide nhc-slide-theme-2" data-slide-index="1">
<div class="nhc-container">
<div class="nhc-hero-content">
<div class="nhc-hero-badge">
<span class="nhc-seal">精工匠造</span>
<span class="nhc-hero-badge-text">企业中台 · 全端生态 · 源码交付</span>
</div>
<h1 class="nhc-hero-title">
经纬立骨铸基石 <br><span class="highlight">精工致远</span>赢未来
</h1>
<p class="nhc-hero-subtitle">
高并发微服务底层中台与跨端原生小程序生态,提供测试驱动开发与金融级安全私有化部署。
</p>
<div class="nhc-hero-cta">
<a href="{:addon_url('official/web.official_product/list',[':pid'=>19,':sid'=>19])}" class="nhc-btn nhc-btn-primary">
<span>软件开发服务</span>
</a>
<a href="{:addon_url('official/web.official_case_show/list',[':pid'=>14,':sid'=>14])}" class="nhc-btn nhc-btn-outline">
<span>查阅标杆案例</span>
</a>
</div>
<div class="nhc-hero-metrics">
<div class="nhc-metric-item">
<div class="nhc-metric-val">&lt;50<sub>ms</sub></div>
<div class="nhc-metric-label">核心接口平均响应</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">100<sub>%</sub></div>
<div class="nhc-metric-label">源码完整交付</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">60<sub>fps</sub></div>
<div class="nhc-metric-label">全端流畅交互</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">ISO<sub>9001</sub></div>
<div class="nhc-metric-label">研发质量严审</div>
</div>
</div>
</div>
</div>
</div>
<!-- 幻灯片 3:智元篇 -->
<div class="nhc-carousel-slide nhc-slide-theme-3" data-slide-index="2">
<div class="nhc-container">
<div class="nhc-hero-content">
<div class="nhc-hero-badge">
<span class="nhc-seal">智能跃升</span>
<span class="nhc-hero-badge-text">专属大模型 · 多智能体 · RAG 知识库</span>
</div>
<h1 class="nhc-hero-title">
格物致知启新智 <br><span class="highlight">人机协同</span>创非凡
</h1>
<p class="nhc-hero-subtitle">
深入垂直行业业务一线,将专属知识库与大模型深度融合,打造安全可控的政企高阶智能体体系。
</p>
<div class="nhc-hero-cta">
<a href="#contact" class="nhc-btn nhc-btn-primary">
<span>预约场景演示</span>
</a>
<a href="#services" class="nhc-btn nhc-btn-outline">
<span>了解智能体</span>
</a>
</div>
<div class="nhc-hero-metrics">
<div class="nhc-metric-item">
<div class="nhc-metric-val">&lt;1.5<sub>s</sub></div>
<div class="nhc-metric-label">精准向量检索</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">85<sub>%</sub></div>
<div class="nhc-metric-label">工单自动解决率</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">Multi<sub>Agent</sub></div>
<div class="nhc-metric-label">多智能体协同调度</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">0<sub>泄露</sub></div>
<div class="nhc-metric-label">私有化本地隔离</div>
</div>
</div>
</div>
</div>
</div>
<!-- 幻灯片 4:赋能篇 -->
<div class="nhc-carousel-slide nhc-slide-theme-4" data-slide-index="3">
<div class="nhc-container">
<div class="nhc-hero-content">
<div class="nhc-hero-badge">
<span class="nhc-seal">矩阵赋能</span>
<span class="nhc-hero-badge-text">商城 · 收银 · 进销存 · 云原生 SaaS</span>
</div>
<h1 class="nhc-hero-title">
积厚流光成重器 <br><span class="highlight">矩阵赋能</span>拓坦途
</h1>
<p class="nhc-hero-subtitle">
千万级真实交易峰值淬炼的标准成熟产品矩阵,支持即开即用公有云 SaaS 与私有化部署。
</p>
<div class="nhc-hero-cta">
<a href="#products" class="nhc-btn nhc-btn-primary">
<span>申请全系统演示</span>
</a>
<a href="#contact" class="nhc-btn nhc-btn-outline">
<span>咨询部署方案</span>
</a>
</div>
<div class="nhc-hero-metrics">
<div class="nhc-metric-item">
<div class="nhc-metric-val">4<sub>大</sub></div>
<div class="nhc-metric-label">核心成熟商业产品</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">10W<sub>+</sub></div>
<div class="nhc-metric-label">日交易订单承载力</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">软硬<sub>一体</sub></div>
<div class="nhc-metric-label">收银智能硬件兼容</div>
</div>
<div class="nhc-metric-item">
<div class="nhc-metric-val">99.99<sub>%</sub></div>
<div class="nhc-metric-label">金融级高可用保障</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 底部精美长条指示器与编号 -->
<div class="nhc-carousel-indicators" id="nhcIndicators">
<div class="nhc-carousel-dot active" data-goto="0">
<span class="nhc-carousel-dot-num">01</span>
<span class="nhc-carousel-dot-bar"></span>
</div>
<div class="nhc-carousel-dot" data-goto="1">
<span class="nhc-carousel-dot-num">02</span>
<span class="nhc-carousel-dot-bar"></span>
</div>
<div class="nhc-carousel-dot" data-goto="2">
<span class="nhc-carousel-dot-num">03</span>
<span class="nhc-carousel-dot-bar"></span>
</div>
<div class="nhc-carousel-dot" data-goto="3">
<span class="nhc-carousel-dot-num">04</span>
<span class="nhc-carousel-dot-bar"></span>
</div>
</div>
</div>
</section>
<!-- 2. 服务入口 (Services Section) -->
<section id="services" class="nhc-services">
<div class="nhc-container">
<div class="nhc-section-header">
<div class="nhc-section-tag">
<span class="nhc-seal">服务矩阵</span>
<span class="nhc-tag-text">SERVICES</span>
</div>
<h2 class="nhc-section-title" style="font-size: 26px;">三大核心服务 · 铸造数字生产力</h2>
<div class="nhc-line-divider"><span></span></div>
</div>
<div class="nhc-services-grid">
<div class="nhc-service-card">
<span class="nhc-service-watermark">壹</span>
<h3 class="nhc-service-title">软件开发</h3>
<p class="nhc-service-desc">
定制企业级业务中台与私有化核心系统,解决高并发性能瓶颈、数据孤岛与复杂业务逻辑流转难题。
</p>
<ul class="nhc-service-list">
<li class="nhc-service-item">企业微服务与分布式高可用架构</li>
<li class="nhc-service-item">业务中台整合与跨系统数据打通</li>
<li class="nhc-service-item">金融级数据加密与私有化安全部署</li>
</ul>
</div>
<div class="nhc-service-card">
<span class="nhc-service-watermark">贰</span>
<h3 class="nhc-service-title">APP与小程序定制</h3>
<p class="nhc-service-desc">
覆盖全端移动生态,深度定制 iOS/Android 原生与跨平台 APP,无缝接入微信、支付宝及抖音小程序。
</p>
<ul class="nhc-service-list">
<li class="nhc-service-item">iOS / Android 跨平台高性能统一框架</li>
<li class="nhc-service-item">微信小程序、企业微信生态深度闭环</li>
<li class="nhc-service-item">蓝牙硬件与物联网 IoT 边缘设备对接</li>
</ul>
</div>
<div class="nhc-service-card">
<span class="nhc-service-watermark">叁</span>
<h3 class="nhc-service-title">智能体开发</h3>
<p class="nhc-service-desc">
聚焦垂直领域大模型工程化落地,研发具备深度业务推理、企业知识库检索(RAG)与自主工作流调度的 Agent。
</p>
<ul class="nhc-service-list">
<li class="nhc-service-item">私域知识库 RAG 向量检索与精准问答</li>
<li class="nhc-service-item">多智能体(Multi-Agent)协同决策与执行</li>
<li class="nhc-service-item">业务审批、数据分析与工单智能自动化</li>
</ul>
</div>
</div>
</div>
</section>
<!-- 3. 产品矩阵入口 (Products Section) -->
<section id="products" class="nhc-products">
<div class="nhc-container">
<div class="nhc-section-header">
<div class="nhc-section-tag">
<span class="nhc-seal">核心产品</span>
<span class="nhc-tag-text">PRODUCTS</span>
</div>
<h2 class="nhc-section-title" style="font-size: 26px;">四大标准化产品矩阵</h2>
<div class="nhc-line-divider"><span></span></div>
</div>
<div class="nhc-products-grid">
<div class="nhc-product-card">
<span class="nhc-product-type-badge">全渠道商城</span>
<h3 class="nhc-product-name">商城</h3>
<p class="nhc-product-desc">B2B2C 多商户入驻、社交裂变营销与全域私域流量精细化运营系统。</p>
</div>
<div class="nhc-product-card">
<span class="nhc-product-type-badge">毫秒级收银</span>
<h3 class="nhc-product-name">收银</h3>
<p class="nhc-product-desc">软硬件一体智能收银系统,聚合支付秒级核销,断网离线平稳记账。</p>
</div>
<div class="nhc-product-card">
<span class="nhc-product-type-badge">业财一体化</span>
<h3 class="nhc-product-name">进销存</h3>
<p class="nhc-product-desc">采购、销售、仓储与财务全链路打通,多仓实时调拨与智能补货预警。</p>
</div>
<div class="nhc-product-card">
<span class="nhc-product-type-badge">多租户平台</span>
<h3 class="nhc-product-name">SaaS版本</h3>
<p class="nhc-product-desc">云原生高可用多租户架构,开箱即用免运维,弹性扩展金融级容灾。</p>
</div>
</div>
</div>
</section>
<!-- 4. 案例入口 (Cases Section) -->
<section id="cases" class="nhc-cases">
<div class="nhc-container">
<div class="nhc-section-header">
<div class="nhc-section-tag">
<span class="nhc-seal">标杆案例</span>
<span class="nhc-tag-text">CASES</span>
</div>
<h2 class="nhc-section-title" style="font-size: 26px;">精选实践成果 · 严谨数据验证</h2>
<div class="nhc-line-divider"><span></span></div>
</div>
<div class="nhc-cases-grid">
<div class="nhc-case-card">
<span class="nhc-case-category">商贸流通</span>
<h3 class="nhc-case-title">快消集团全渠道分销订货中台</h3>
<div class="nhc-case-metrics-bar">
<div class="nhc-case-metric-box">
<div class="nhc-case-metric-num">65%</div>
<div class="nhc-case-metric-sub">订单效率提升</div>
</div>
<div class="nhc-case-metric-box">
<div class="nhc-case-metric-num">10W+</div>
<div class="nhc-case-metric-sub">日峰值订单</div>
</div>
</div>
</div>
<div class="nhc-case-card">
<span class="nhc-case-category">连锁零售</span>
<h3 class="nhc-case-title">全国餐饮连锁收银与门店一体化</h3>
<div class="nhc-case-metrics-bar">
<div class="nhc-case-metric-box">
<div class="nhc-case-metric-num">70%</div>
<div class="nhc-case-metric-sub">结算耗时缩短</div>
</div>
<div class="nhc-case-metric-box">
<div class="nhc-case-metric-num">300+</div>
<div class="nhc-case-metric-sub">门店稳定运行</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 5. 流程板块 (Process Section) -->
<section id="process" class="nhc-process">
<div class="nhc-container">
<div class="nhc-section-header">
<div class="nhc-section-tag">
<span class="nhc-seal">交付体系</span>
<span class="nhc-tag-text">PROCESS</span>
</div>
<h2 class="nhc-section-title" style="font-size: 26px;">五步严谨工程法</h2>
<div class="nhc-line-divider"><span></span></div>
</div>
<div class="nhc-process-flow">
<div class="nhc-process-card">
<div class="nhc-process-step-num">01</div>
<h4 class="nhc-process-step-title">需求深度研判</h4>
</div>
<div class="nhc-process-card">
<div class="nhc-process-step-num">02</div>
<h4 class="nhc-process-step-title">架构严谨立骨</h4>
</div>
<div class="nhc-process-card">
<div class="nhc-process-step-num">03</div>
<h4 class="nhc-process-step-title">敏捷测试驱动</h4>
</div>
<div class="nhc-process-card">
<div class="nhc-process-step-num">04</div>
<h4 class="nhc-process-step-title">高压安全审计</h4>
</div>
<div class="nhc-process-card">
<div class="nhc-process-step-num">05</div>
<h4 class="nhc-process-step-title">私有化与维保</h4>
</div>
</div>
</div>
</section>
<!-- 6. 客户评价 (Testimonials Section) -->
<section class="nhc-testimonials">
<div class="nhc-container">
<div class="nhc-section-header">
<div class="nhc-section-tag">
<span class="nhc-seal">信赖之选</span>
<span class="nhc-tag-text">TESTIMONIALS</span>
</div>
<h2 class="nhc-section-title" style="font-size: 26px;">客户信赖之选</h2>
<div class="nhc-line-divider"><span></span></div>
</div>
<div class="nhc-testimonials-grid">
<div class="nhc-testimonial-card">
<p class="nhc-testimonial-text">
纳海川团队展现了极强的架构能力与业务敏锐度,为我们重构的订货中台平稳抗住大促峰值压力,库存对账零误差。
</p>
<div class="nhc-author-name">张总 · 供应链集团技术负责人</div>
</div>
<div class="nhc-testimonial-card">
<p class="nhc-testimonial-text">
收银与门店进销存系统在 300 家连锁门店上线后运行极为稳定,离线记账功能解决了门店断网的大隐患。
</p>
<div class="nhc-author-name">李总 · 连锁餐饮运营副总裁</div>
</div>
</div>
</div>
</section>
<!-- 7. 底部 CTA -->
<section id="contact" class="nhc-cta">
<div class="nhc-container">
<div class="nhc-cta-inner">
<div class="nhc-cta-content">
<h2 class="nhc-cta-title" style="font-size: 26px;">开启新一代数字化与智能化升级</h2>
<p class="nhc-cta-desc">
资深系统架构师团队随时待命,为您提供深度业务剖析与技术方案规划。
</p>
</div>
<div class="nhc-cta-buttons" style="margin-top: 20px;">
<a href="tel:{:__config('site_mobile','value')}" class="nhc-btn nhc-cta-btn-light">
<span>致电专家咨询</span>
</a>
</div>
</div>
</div>
</section>
<!-- 移动端首页主体 结束 -->
{/block}
{block name="js"}
<script>
document.addEventListener('DOMContentLoaded', function() {
var carousel = document.getElementById('nhcHeroCarousel');
if (!carousel) return;
var slides = carousel.querySelectorAll('.nhc-carousel-slide');
var dots = carousel.querySelectorAll('.nhc-carousel-dot');
var currentIndex = 0;
var totalSlides = slides.length;
var autoPlayTimer = null;
var intervalDuration = 5500;
function goToSlide(index) {
if (index < 0) {
index = totalSlides - 1;
} else if (index >= totalSlides) {
index = 0;
}
slides.forEach(function(slide, i) {
if (i === index) {
slide.classList.add('active');
} else {
slide.classList.remove('active');
}
});
dots.forEach(function(dot, i) {
if (i === index) {
dot.classList.add('active');
} else {
dot.classList.remove('active');
}
});
currentIndex = index;
}
function nextSlide() {
goToSlide(currentIndex + 1);
}
function prevSlide() {
goToSlide(currentIndex - 1);
}
function startAutoPlay() {
stopAutoPlay();
autoPlayTimer = setInterval(nextSlide, intervalDuration);
}
function stopAutoPlay() {
if (autoPlayTimer) {
clearInterval(autoPlayTimer);
autoPlayTimer = null;
}
}
dots.forEach(function(dot) {
dot.addEventListener('click', function() {
var targetIdx = parseInt(this.getAttribute('data-goto'), 10);
if (!isNaN(targetIdx)) {
goToSlide(targetIdx);
startAutoPlay();
}
});
});
// 移动端全屏滑动手势优化
var touchStartX = 0;
var touchEndX = 0;
carousel.addEventListener('touchstart', function(e) {
touchStartX = e.changedTouches[0].screenX;
stopAutoPlay();
}, { passive: true });
carousel.addEventListener('touchend', function(e) {
touchEndX = e.changedTouches[0].screenX;
if (touchStartX - touchEndX > 45) {
nextSlide();
} else if (touchEndX - touchStartX > 45) {
prevSlide();
}
startAutoPlay();
}, { passive: true });
document.addEventListener('visibilitychange', function() {
if (document.hidden) {
stopAutoPlay();
} else {
startAutoPlay();
}
});
startAutoPlay();
});
</script>
{/block}