docs(website): 重构关于页面布局和内容
- 更新页面布局，优化导航栏和面包屑导航 - 重新组织页面内容，突出公司使命和价值观 - 添加发展历程和核心团队介绍 - 更新合作伙伴展示方式 - 调整页脚内容，增加社交媒体链接
This commit is contained in:
@@ -53,451 +53,308 @@
|
||||
<a class="nav-link" href="contact.html">联系我们</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="ms-3">
|
||||
<a href="contact.html" class="btn btn-primary">免费试用</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- 页面内容 -->
|
||||
<main>
|
||||
<!-- 英雄区域 -->
|
||||
<section class="hero-section bg-dark text-white py-5 mt-5">
|
||||
<div class="container py-5">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-8 mx-auto text-center">
|
||||
<h1 class="display-4 fw-bold mb-4">客户成功案例</h1>
|
||||
<p class="lead mb-4">见证我们如何帮助客户实现采购数字化转型升级，提升业务效率和盈利能力</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- 面包屑导航 -->
|
||||
<nav aria-label="breadcrumb" class="pt-5 mt-5">
|
||||
<div class="container">
|
||||
<ol class="breadcrumb">
|
||||
<li class="breadcrumb-item"><a href="index.html">首页</a></li>
|
||||
<li class="breadcrumb-item active" aria-current="page">客户案例</li>
|
||||
</ol>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- 案例筛选 -->
|
||||
<section class="py-4 bg-white">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="d-flex flex-wrap justify-content-center gap-2">
|
||||
<button class="btn btn-outline-primary active" data-filter="all">全部案例</button>
|
||||
<button class="btn btn-outline-primary" data-filter="large">大型企业</button>
|
||||
<button class="btn btn-outline-primary" data-filter="medium">中型企业</button>
|
||||
<button class="btn btn-outline-primary" data-filter="small">小型企业</button>
|
||||
<button class="btn btn-outline-primary" data-filter="beef">肉牛养殖</button>
|
||||
<button class="btn btn-outline-primary" data-filter="dairy">奶牛牧场</button>
|
||||
<button class="btn btn-outline-primary" data-filter="trade">贸易服务</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 案例展示 -->
|
||||
<section class="py-5">
|
||||
<div class="container">
|
||||
<div class="row g-4" id="cases-container">
|
||||
<!-- 案例1 -->
|
||||
<div class="col-lg-4 col-md-6 case-item" data-category="large beef" data-aos="fade-up">
|
||||
<div class="card h-100 border-0 shadow-sm case-card">
|
||||
<div class="card-img-top position-relative">
|
||||
<div class="placeholder-image bg-primary bg-opacity-10 d-flex align-items-center justify-content-center feature-icon" style="height: 200px;">
|
||||
<i class="fas fa-building fs-1 text-primary"></i>
|
||||
</div>
|
||||
<span class="position-absolute top-0 end-0 m-3 badge bg-primary">大型企业</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h5 class="fw-bold text-dark mb-2">内蒙古草原牧业集团</h5>
|
||||
<span class="badge bg-light text-dark mb-3">肉牛养殖 · 年采购5000+头</span>
|
||||
<p class="text-muted mb-3">通过系统实现采购流程标准化，采购效率提升40%，成本降低15%</p>
|
||||
|
||||
<div class="case-stats mb-3">
|
||||
<div class="d-flex justify-content-between small text-muted">
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 效率 +40%</span>
|
||||
<span><i class="fas fa-arrow-down text-danger me-1"></i> 成本 -15%</span>
|
||||
<span><i class="fas fa-chart-line text-primary me-1"></i> ROI 3.2倍</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="testimonial bg-light p-3 rounded mb-3">
|
||||
<p class="mb-0 small text-muted">"系统帮助我们实现了采购全流程数字化，现在我们可以实时追踪每头牛的状态，大大提升了管理效率。"</p>
|
||||
<div class="d-flex align-items-center mt-2">
|
||||
<div class="avatar-placeholder bg-primary bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center feature-icon" style="width: 30px; height: 30px;">
|
||||
<i class="fas fa-user text-primary fs-6"></i>
|
||||
</div>
|
||||
<div>
|
||||
<span class="small fw-bold">张总</span>
|
||||
<span class="small d-block text-muted">采购总监</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 案例2 -->
|
||||
<div class="col-lg-4 col-md-6 case-item" data-category="medium dairy" data-aos="fade-up" data-aos-delay="100">
|
||||
<div class="card h-100 border-0 shadow-sm case-card">
|
||||
<div class="card-img-top position-relative">
|
||||
<div class="placeholder-image bg-success bg-opacity-10 d-flex align-items-center justify-content-center" style="height: 200px;">
|
||||
<i class="fas fa-tractor fs-1 text-success"></i>
|
||||
</div>
|
||||
<span class="position-absolute top-0 end-0 m-3 badge bg-success">中型企业</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h5 class="fw-bold text-dark mb-2">河北优牧乳业</h5>
|
||||
<span class="badge bg-light text-dark mb-3">奶牛牧场 · 年采购2000头</span>
|
||||
<p class="text-muted mb-3">数字化管理育种牛只采购，奶牛品质提升20%，产奶量增加15%</p>
|
||||
|
||||
<div class="case-stats mb-3">
|
||||
<div class="d-flex justify-content-between small text-muted">
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 品质 +20%</span>
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 产量 +15%</span>
|
||||
<span><i class="fas fa-chart-line text-primary me-1"></i> ROI 2.8倍</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="testimonial bg-light p-3 rounded mb-3">
|
||||
<p class="mb-0 small text-muted">"系统的数据分析功能帮助我们筛选出最优质的育种牛只，现在我们的奶牛品质和产奶量都有了显著提升。"</p>
|
||||
<div class="d-flex align-items-center mt-2">
|
||||
<div class="avatar-placeholder bg-success bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px;">
|
||||
<i class="fas fa-user text-success fs-6"></i>
|
||||
</div>
|
||||
<div>
|
||||
<span class="small fw-bold">李经理</span>
|
||||
<span class="small d-block text-muted">牧场负责人</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 案例3 -->
|
||||
<div class="col-lg-4 col-md-6 case-item" data-category="small trade" data-aos="fade-up" data-aos-delay="200">
|
||||
<div class="card h-100 border-0 shadow-sm case-card">
|
||||
<div class="card-img-top position-relative">
|
||||
<div class="placeholder-image bg-warning bg-opacity-10 d-flex align-items-center justify-content-center" style="height: 200px;">
|
||||
<i class="fas fa-handshake fs-1 text-warning"></i>
|
||||
</div>
|
||||
<span class="position-absolute top-0 end-0 m-3 badge bg-warning">小型企业</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h5 class="fw-bold text-dark mb-2">山东牛贸中介服务</h5>
|
||||
<span class="badge bg-light text-dark mb-3">贸易服务 · 年交易3000头</span>
|
||||
<p class="text-muted mb-3">通过平台实现买卖双方高效匹配，交易成功率提升50%，佣金收入翻倍</p>
|
||||
|
||||
<div class="case-stats mb-3">
|
||||
<div class="d-flex justify-content-between small text-muted">
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 成功率 +50%</span>
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 收入 +100%</span>
|
||||
<span><i class="fas fa-chart-line text-primary me-1"></i> ROI 4.1倍</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="testimonial bg-light p-3 rounded mb-3">
|
||||
<p class="mb-0 small text-muted">"这个系统彻底改变了我们的业务模式，现在我们可以同时处理多个交易，客户满意度大幅提升。"</p>
|
||||
<div class="d-flex align-items-center mt-2">
|
||||
<div class="avatar-placeholder bg-warning bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px;">
|
||||
<i class="fas fa-user text-warning fs-6"></i>
|
||||
</div>
|
||||
<div>
|
||||
<span class="small fw-bold">王总</span>
|
||||
<span class="small d-block text-muted">创始人</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 案例4 -->
|
||||
<div class="col-lg-4 col-md-6 case-item" data-category="medium beef" data-aos="fade-up" data-aos-delay="300">
|
||||
<div class="card h-100 border-0 shadow-sm case-card">
|
||||
<div class="card-img-top position-relative">
|
||||
<div class="placeholder-image bg-info bg-opacity-10 d-flex align-items-center justify-content-center" style="height: 200px;">
|
||||
<i class="fas fa-industry fs-1 text-info"></i>
|
||||
</div>
|
||||
<span class="position-absolute top-0 end-0 m-3 badge bg-info">中型企业</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h5 class="fw-bold text-dark mb-2">河南美味肉制品</h5>
|
||||
<span class="badge bg-light text-dark mb-3">肉牛加工 · 年采购1500头</span>
|
||||
<p class="text-muted mb-3">实现从采购到加工的全程追溯，产品质量提升30%，客户投诉减少80%</p>
|
||||
|
||||
<div class="case-stats mb-3">
|
||||
<div class="d-flex justify-content-between small text-muted">
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 质量 +30%</span>
|
||||
<span><i class="fas fa-arrow-down text-danger me-1"></i> 投诉 -80%</span>
|
||||
<span><i class="fas fa-chart-line text-primary me-1"></i> ROI 3.5倍</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="testimonial bg-light p-3 rounded mb-3">
|
||||
<p class="mb-0 small text-muted">"追溯系统让我们的产品质量有了保障，现在客户可以扫描二维码了解每块肉的来源，信任度大大提升。"</p>
|
||||
<div class="d-flex align-items-center mt-2">
|
||||
<div class="avatar-placeholder bg-info bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px;">
|
||||
<i class="fas fa-user text-info fs-6"></i>
|
||||
</div>
|
||||
<div>
|
||||
<span class="small fw-bold">赵厂长</span>
|
||||
<span class="small d-block text-muted">生产总监</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 案例5 -->
|
||||
<div class="col-lg-4 col-md-6 case-item" data-category="large dairy" data-aos="fade-up" data-aos-delay="400">
|
||||
<div class="card h-100 border-0 shadow-sm case-card">
|
||||
<div class="card-img-top position-relative">
|
||||
<div class="placeholder-image bg-purple bg-opacity-10 d-flex align-items-center justify-content-center" style="height: 200px;">
|
||||
<i class="fas fa-seedling fs-1 text-purple"></i>
|
||||
</div>
|
||||
<span class="position-absolute top-0 end-0 m-3 badge bg-purple">大型企业</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h5 class="fw-bold text-dark mb-2">宁夏现代牧业</h5>
|
||||
<span class="badge bg-light text-dark mb-3">综合养殖 · 年采购8000头</span>
|
||||
<p class="text-muted mb-3">多牧场统一管理平台，运营成本降低25%，管理效率提升60%</p>
|
||||
|
||||
<div class="case-stats mb-3">
|
||||
<div class="d-flex justify-content-between small text-muted">
|
||||
<span><i class="fas fa-arrow-down text-danger me-1"></i> 成本 -25%</span>
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 效率 +60%</span>
|
||||
<span><i class="fas fa-chart-line text-primary me-1"></i> ROI 4.3倍</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="testimonial bg-light p-3 rounded mb-3">
|
||||
<p class="mb-0 small text-muted">"系统帮助我们实现了多个牧场的统一管理，现在我们可以实时掌握各牧场的运营状况，决策更加科学。"</p>
|
||||
<div class="d-flex align-items-center mt-2">
|
||||
<div class="avatar-placeholder bg-purple bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px;">
|
||||
<i class="fas fa-user text-purple fs-6"></i>
|
||||
</div>
|
||||
<div>
|
||||
<span class="small fw-bold">陈总</span>
|
||||
<span class="small d-block text-muted">运营副总裁</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 案例6 -->
|
||||
<div class="col-lg-4 col-md-6 case-item" data-category="small beef" data-aos="fade-up" data-aos-delay="500">
|
||||
<div class="card h-100 border-0 shadow-sm case-card">
|
||||
<div class="card-img-top position-relative">
|
||||
<div class="placeholder-image bg-orange bg-opacity-10 d-flex align-items-center justify-content-center" style="height: 200px;">
|
||||
<i class="fas fa-home fs-1 text-orange"></i>
|
||||
</div>
|
||||
<span class="position-absolute top-0 end-0 m-3 badge bg-orange">小型企业</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h5 class="fw-bold text-dark mb-2">四川家庭农场</h5>
|
||||
<span class="badge bg-light text-dark mb-3">家庭养殖 · 年采购500头</span>
|
||||
<p class="text-muted mb-3">小规模养殖数字化入门方案，管理成本降低40%，养殖效益提升35%</p>
|
||||
|
||||
<div class="case-stats mb-3">
|
||||
<div class="d-flex justify-content-between small text-muted">
|
||||
<span><i class="fas fa-arrow-down text-danger me-1"></i> 成本 -40%</span>
|
||||
<span><i class="fas fa-arrow-up text-success me-1"></i> 效益 +35%</span>
|
||||
<span><i class="fas fa-chart-line text-primary me-1"></i> ROI 2.5倍</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="testimonial bg-light p-3 rounded mb-3">
|
||||
<p class="mb-0 small text-muted">"作为家庭农场，我们原本担心数字化门槛太高，但这个系统非常容易上手，现在我们的养殖效益明显提升了。"</p>
|
||||
<div class="d-flex align-items-center mt-2">
|
||||
<div class="avatar-placeholder bg-orange bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px;">
|
||||
<i class="fas fa-user text-orange fs-6"></i>
|
||||
</div>
|
||||
<div>
|
||||
<span class="small fw-bold">刘先生</span>
|
||||
<span class="small d-block text-muted">农场主</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 数据统计 -->
|
||||
<div class="row mt-5 pt-5" data-aos="fade-up">
|
||||
<div class="col-12 text-center mb-5">
|
||||
<h3 class="fw-bold text-dark mb-3">客户成功数据</h3>
|
||||
<p class="text-muted">基于200+企业客户的真实使用数据统计</p>
|
||||
<!-- 客户案例 -->
|
||||
<section class="py-5">
|
||||
<div class="container">
|
||||
<div class="text-center mb-5">
|
||||
<h1 class="display-5 fw-bold mb-4">客户案例</h1>
|
||||
<p class="lead">看看我们的客户如何通过系统提升业务效率</p>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3 col-md-6 text-center mb-4" data-aos="fade-up" data-aos-delay="100">
|
||||
<div class="display-4 fw-bold text-primary mb-2">85%</div>
|
||||
<p class="text-muted">客户续约率</p>
|
||||
<div class="row g-4 mb-5">
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card case-card h-100 border-0">
|
||||
<img src="images/case1.jpg" class="card-img-top" alt="XX牧业集团" loading="lazy">
|
||||
<div class="card-body">
|
||||
<span class="badge bg-primary mb-2">大型企业</span>
|
||||
<h5 class="card-title">XX牧业集团采购数字化转型</h5>
|
||||
<p class="card-text">通过实施活牛采购智能数字化系统，该集团实现了采购流程标准化，采购效率提升40%。</p>
|
||||
<a href="#case-detail-1" class="btn btn-outline-primary">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card case-card h-100 border-0">
|
||||
<img src="images/case2.jpg" class="card-img-top" alt="YY生态牧场" loading="lazy">
|
||||
<div class="card-body">
|
||||
<span class="badge bg-success mb-2">中型企业</span>
|
||||
<h5 class="card-title">YY生态牧场采购管理升级</h5>
|
||||
<p class="card-text">该牧场通过系统化管理采购流程，显著降低了采购风险，提升了供应商管理效率。</p>
|
||||
<a href="#case-detail-2" class="btn btn-outline-primary">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card case-card h-100 border-0">
|
||||
<img src="images/case3.jpg" class="card-img-top" alt="ZZ活牛贸易平台" loading="lazy">
|
||||
<div class="card-body">
|
||||
<span class="badge bg-info mb-2">贸易商</span>
|
||||
<h5 class="card-title">ZZ活牛贸易平台业务优化</h5>
|
||||
<p class="card-text">贸易商通过系统实现了多方交易协调，显著提升了交易效率和资金安全性。</p>
|
||||
<a href="#case-detail-3" class="btn btn-outline-primary">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6 text-center mb-4" data-aos="fade-up" data-aos-delay="200">
|
||||
<div class="display-4 fw-bold text-success mb-2">3.2倍</div>
|
||||
<p class="text-muted">平均投资回报率</p>
|
||||
|
||||
<!-- 案例详情 -->
|
||||
<div id="case-detail-1" class="card mb-5">
|
||||
<div class="card-body">
|
||||
<h2 class="card-title">XX牧业集团采购数字化转型</h2>
|
||||
<span class="badge bg-primary mb-3">大型企业</span>
|
||||
<h4 class="mt-4">客户背景</h4>
|
||||
<p>XX牧业集团是国内知名的大型畜牧养殖企业，年活牛采购量超过5000头，拥有多个采购点和供应商。</p>
|
||||
|
||||
<h4 class="mt-4">面临挑战</h4>
|
||||
<ul>
|
||||
<li>供应商管理分散，缺乏统一标准</li>
|
||||
<li>采购流程复杂，审批环节多</li>
|
||||
<li>数据统计困难，难以进行有效分析</li>
|
||||
<li>运输过程不透明，风险控制困难</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="mt-4">解决方案</h4>
|
||||
<p>为该集团部署了企业版活牛采购智能数字化系统，包含供应商管理、采购计划、质检流程、运输跟踪、财务结算等全功能模块。</p>
|
||||
|
||||
<h4 class="mt-4">实施效果</h4>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-primary">40%</div>
|
||||
<div class="stat-label">采购效率提升</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-primary">30%</div>
|
||||
<div class="stat-label">采购成本降低</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-primary">95%</div>
|
||||
<div class="stat-label">数据准确性</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-primary">100%</div>
|
||||
<div class="stat-label">流程标准化</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4 class="mt-4">客户评价</h4>
|
||||
<blockquote class="blockquote">
|
||||
<p>"活牛采购智能数字化系统的实施，彻底改变了我们传统的采购管理模式。现在我们可以实时掌握采购全流程，大大提升了管理效率和决策水平。"</p>
|
||||
<footer class="blockquote-footer">XX牧业集团采购总监</footer>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6 text-center mb-4" data-aos="fade-up" data-aos-delay="300">
|
||||
<div class="display-4 fw-bold text-warning mb-2">45%</div>
|
||||
<p class="text-muted">平均效率提升</p>
|
||||
|
||||
<div id="case-detail-2" class="card mb-5">
|
||||
<div class="card-body">
|
||||
<h2 class="card-title">YY生态牧场采购管理升级</h2>
|
||||
<span class="badge bg-success mb-3">中型企业</span>
|
||||
<h4 class="mt-4">客户背景</h4>
|
||||
<p>YY生态牧场是一家专注于生态养殖的中型牧场，年采购活牛约800头，注重产品质量和可持续发展。</p>
|
||||
|
||||
<h4 class="mt-4">面临挑战</h4>
|
||||
<ul>
|
||||
<li>采购计划制定缺乏科学依据</li>
|
||||
<li>供应商评估标准不统一</li>
|
||||
<li>质检流程不规范，存在风险</li>
|
||||
<li>成本控制困难，利润空间压缩</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="mt-4">解决方案</h4>
|
||||
<p>为该牧场部署了标准版活牛采购智能数字化系统，重点优化采购计划、供应商管理、质检流程等功能模块。</p>
|
||||
|
||||
<h4 class="mt-4">实施效果</h4>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-success">25%</div>
|
||||
<div class="stat-label">采购成本降低</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-success">50%</div>
|
||||
<div class="stat-label">质检效率提升</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-success">100%</div>
|
||||
<div class="stat-label">供应商标准化</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-success">90%</div>
|
||||
<div class="stat-label">客户满意度</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4 class="mt-4">客户评价</h4>
|
||||
<blockquote class="blockquote">
|
||||
<p>"系统帮助我们建立了科学的采购管理体系，不仅降低了成本，更重要的是提升了产品质量控制水平，为我们的生态养殖理念提供了有力支撑。"</p>
|
||||
<footer class="blockquote-footer">YY生态牧场总经理</footer>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6 text-center mb-4" data-aos="fade-up" data-aos-delay="400">
|
||||
<div class="display-4 fw-bold text-info mb-2">20%</div>
|
||||
<p class="text-muted">平均成本降低</p>
|
||||
|
||||
<div id="case-detail-3" class="card mb-5">
|
||||
<div class="card-body">
|
||||
<h2 class="card-title">ZZ活牛贸易平台业务优化</h2>
|
||||
<span class="badge bg-info mb-3">贸易商</span>
|
||||
<h4 class="mt-4">客户背景</h4>
|
||||
<p>ZZ活牛贸易平台是一家专业的活牛贸易商，年交易量约3000头，连接多个养殖场和买家。</p>
|
||||
|
||||
<h4 class="mt-4">面临挑战</h4>
|
||||
<ul>
|
||||
<li>多方交易协调困难</li>
|
||||
<li>订单跟踪不及时，容易出错</li>
|
||||
<li>结算流程复杂，风险较高</li>
|
||||
<li>缺乏有效数据分析，决策困难</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="mt-4">解决方案</h4>
|
||||
<p>为该贸易平台定制开发了贸易商专用版系统，重点强化订单管理、多方协调、结算风控等功能。</p>
|
||||
|
||||
<h4 class="mt-4">实施效果</h4>
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-info">35%</div>
|
||||
<div class="stat-label">交易效率提升</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-info">99%</div>
|
||||
<div class="stat-label">订单准确率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-info">50%</div>
|
||||
<div class="stat-label">结算风险降低</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6 mb-4">
|
||||
<div class="text-center p-3 bg-light rounded">
|
||||
<div class="stat-number display-6 text-info">100%</div>
|
||||
<div class="stat-label">交易透明化</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4 class="mt-4">客户评价</h4>
|
||||
<blockquote class="blockquote">
|
||||
<p>"数字化系统让我们的贸易业务更加透明高效，多方协调变得轻松简单，客户满意度大幅提升。这正是我们一直在寻找的解决方案。"</p>
|
||||
<footer class="blockquote-footer">ZZ活牛贸易平台运营总监</footer>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<!-- CTA区域 -->
|
||||
<section class="py-5 bg-primary text-white">
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-8">
|
||||
<h3 class="fw-bold mb-3">Ready to see similar results?</h3>
|
||||
<p class="mb-4">加入200+成功企业的行列，开启您的数字化采购转型之旅</p>
|
||||
</div>
|
||||
<div class="col-lg-4 text-lg-end">
|
||||
<a href="contact.html" class="btn btn-light btn-lg px-4">立即咨询</a>
|
||||
</div>
|
||||
<!-- CTA -->
|
||||
<section class="py-5">
|
||||
<div class="container">
|
||||
<div class="card bg-primary text-white border-0 shadow">
|
||||
<div class="card-body p-5 text-center">
|
||||
<h3 class="mb-3">开启您的数字化采购之旅</h3>
|
||||
<p class="mb-4">立即申请免费试用，体验活牛采购智能数字化系统带来的效率提升</p>
|
||||
<a href="contact.html" class="btn btn-light btn-lg">免费试用</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 页脚 -->
|
||||
<footer class="bg-dark text-white py-5">
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-4 mb-4">
|
||||
<h5 class="fw-bold mb-3">活牛采购智能数字化系统</h5>
|
||||
<p class="text-light">
|
||||
专业的数字化采购管理解决方案，
|
||||
为养殖企业提供全流程的采购数字化服务。
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-4 mb-4">
|
||||
<h6 class="fw-bold mb-3">产品</h6>
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="product.html" class="text-muted text-decoration-none">产品介绍</a></li>
|
||||
<li><a href="solutions.html" class="text-muted text-decoration-none">解决方案</a></li>
|
||||
<li><a href="#" class="text-muted text-decoration-none">价格方案</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-4 mb-4">
|
||||
<h6 class="fw-bold mb-3">资源</h6>
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="cases.html" class="text-muted text-decoration-none">客户案例</a></li>
|
||||
<li><a href="news.html" class="text-muted text-decoration-none">新闻动态</a></li>
|
||||
<li><a href="#" class="text-muted text-decoration-none">帮助文档</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-4 mb-4">
|
||||
<h6 class="fw-bold mb-3">公司</h6>
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="about.html" class="text-muted text-decoration-none">关于我们</a></li>
|
||||
<li><a href="contact.html" class="text-muted text-decoration-none">联系我们</a></li>
|
||||
<li><a href="#" class="text-muted text-decoration-none">加入我们</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-4 mb-4">
|
||||
<h6 class="fw-bold mb-3">联系信息</h6>
|
||||
<div class="text-muted">
|
||||
<p class="mb-1"><i class="fas fa-phone me-2"></i> 400-123-4567</p>
|
||||
<p class="mb-1"><i class="fas fa-envelope me-2"></i> info@niumall.com</p>
|
||||
<p class="mb-0"><i class="fas fa-map-marker-alt me-2"></i> 北京市朝阳区</p>
|
||||
<div class="col-lg-4 mb-4 mb-lg-0">
|
||||
<h5 class="footer-title">活牛采购智能数字化系统</h5>
|
||||
<p>专业的活牛采购全流程数字化管理解决方案，提升采购效率，降低经营风险。</p>
|
||||
<div class="d-flex">
|
||||
<a href="#" class="social-icon"><i class="fab fa-weixin"></i></a>
|
||||
<a href="#" class="social-icon"><i class="fab fa-weibo"></i></a>
|
||||
<a href="#" class="social-icon"><i class="fab fa-linkedin-in"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-4 mb-4 mb-md-0">
|
||||
<h5 class="footer-title">产品</h5>
|
||||
<ul class="list-unstyled">
|
||||
<li class="mb-2"><a href="product.html">功能介绍</a></li>
|
||||
<li class="mb-2"><a href="solutions.html">解决方案</a></li>
|
||||
<li class="mb-2"><a href="cases.html">客户案例</a></li>
|
||||
<li class="mb-2"><a href="news.html">更新日志</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-4 mb-4 mb-md-0">
|
||||
<h5 class="footer-title">支持</h5>
|
||||
<ul class="list-unstyled">
|
||||
<li class="mb-2"><a href="#">帮助中心</a></li>
|
||||
<li class="mb-2"><a href="#">在线客服</a></li>
|
||||
<li class="mb-2"><a href="#">开发者文档</a></li>
|
||||
<li class="mb-2"><a href="#">合作伙伴</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4 col-md-4">
|
||||
<h5 class="footer-title">联系我们</h5>
|
||||
<ul class="list-unstyled">
|
||||
<li class="mb-2"><i class="fas fa-map-marker-alt me-2"></i> 北京市朝阳区xxx街道xxx号</li>
|
||||
<li class="mb-2"><i class="fas fa-phone me-2"></i> 400-xxx-xxxx</li>
|
||||
<li class="mb-2"><i class="fas fa-envelope me-2"></i> info@example.com</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="my-4">
|
||||
|
||||
<div class="row align-items-center">
|
||||
<div class="col-md-6">
|
||||
<p class="text-muted mb-0">© 2024 活牛采购智能数字化系统. 保留所有权利.</p>
|
||||
</div>
|
||||
<div class="col-md-6 text-md-end">
|
||||
<div class="d-flex justify-content-md-end">
|
||||
<a href="#" class="text-muted me-3"><i class="fab fa-weixin fa-lg"></i></a>
|
||||
<a href="#" class="text-muted me-3"><i class="fab fa-weibo fa-lg"></i></a>
|
||||
<a href="#" class="text-muted"><i class="fab fa-linkedin fa-lg"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="copyright text-center">
|
||||
<p>© 2023 活牛采购智能数字化系统. 保留所有权利。</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- JavaScript -->
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- 返回顶部按钮 -->
|
||||
<button class="back-to-top" aria-label="返回顶部">
|
||||
<i class="fas fa-arrow-up"></i>
|
||||
</button>
|
||||
|
||||
<!-- Bootstrap JS -->
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- AOS Animation -->
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/aos/2.3.4/aos.js"></script>
|
||||
<!-- 自定义脚本 -->
|
||||
<script src="js/main.js"></script>
|
||||
|
||||
<script>
|
||||
// 初始化AOS动画
|
||||
AOS.init({
|
||||
duration: 1000,
|
||||
once: true,
|
||||
offset: 100
|
||||
});
|
||||
|
||||
// 案例筛选功能
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const filterButtons = document.querySelectorAll('[data-filter]');
|
||||
const caseItems = document.querySelectorAll('.case-item');
|
||||
|
||||
filterButtons.forEach(button => {
|
||||
button.addEventListener('click', function() {
|
||||
// 移除所有active状态
|
||||
filterButtons.forEach(btn => btn.classList.remove('active'));
|
||||
// 添加当前active状态
|
||||
this.classList.add('active');
|
||||
|
||||
const filterValue = this.getAttribute('data-filter');
|
||||
|
||||
caseItems.forEach(item => {
|
||||
if (filterValue === 'all') {
|
||||
item.style.display = 'block';
|
||||
} else {
|
||||
const categories = item.getAttribute('data-category').split(' ');
|
||||
if (categories.includes(filterValue)) {
|
||||
item.style.display = 'block';
|
||||
} else {
|
||||
item.style.display = 'none';
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.bg-purple { background-color: #6f42c1 !important; }
|
||||
.bg-orange { background-color: #fd7e14 !important; }
|
||||
.text-purple { color: #6f42c1 !important; }
|
||||
.text-orange { color: #fd7e14 !important; }
|
||||
|
||||
.case-card {
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
.case-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
|
||||
}
|
||||
|
||||
.placeholder-image {
|
||||
background: linear-gradient(135deg, var(--bs-primary-bg-subtle), var(--bs-light));
|
||||
}
|
||||
|
||||
.avatar-placeholder {
|
||||
background: linear-gradient(135deg, var(--bs-primary-bg-subtle), var(--bs-light));
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user