"在网站导航栏统一添加开发者文档、合作伙伴和在线客服链接"

This commit is contained in:
2025-09-18 14:49:11 +08:00
parent 974727c7fd
commit 31bc064018
11 changed files with 1237 additions and 0 deletions

View File

@@ -72,6 +72,15 @@
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

View File

@@ -73,6 +73,15 @@
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

View File

@@ -78,6 +78,15 @@
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="contact.html">联系我们</a>
</li>

View File

@@ -59,6 +59,12 @@
<li class="nav-item">
<a class="nav-link active" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

View File

@@ -59,6 +59,15 @@
<li class="nav-item">
<a class="nav-link active" href="help.html">帮助中心</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

View File

@@ -79,6 +79,15 @@
<li class="nav-item">
<a class="nav-link" href="about.html">关于我们</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

View File

@@ -67,6 +67,15 @@
<li class="nav-item">
<a class="nav-link" href="about.html">关于我们</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

550
website/partners.html Normal file
View File

@@ -0,0 +1,550 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>合作伙伴 - 活牛采购智能数字化系统</title>
<meta name="description" content="活牛采购智能数字化系统合作伙伴计划,与养殖企业、屠宰加工企业、物流公司等建立战略合作关系。">
<meta name="keywords" content="合作伙伴,战略合作,养殖企业,屠宰加工,物流公司,供应链合作">
<!-- Bootstrap 5 CSS -->
<link href="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap Icons -->
<link href="https://cdn.bootcdn.net/ajax/libs/bootstrap-icons/1.11.0/font/bootstrap-icons.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet">
<!-- AOS Animation -->
<link href="https://cdn.bootcdn.net/ajax/libs/aos/2.3.4/aos.css" rel="stylesheet">
<!-- 自定义样式 -->
<link href="css/custom.css" rel="stylesheet">
</head>
<body>
<!-- 导航栏 -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top shadow-sm">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="index.html">
<div class="logo-container me-2">
<i class="fas fa-cow text-primary fs-2"></i>
</div>
<div class="brand-text">
<div class="brand-name fw-bold">NiuMall</div>
<div class="brand-subtitle">活牛采购智能系统</div>
</div>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="product.html">产品介绍</a>
</li>
<li class="nav-item">
<a class="nav-link" href="solutions.html">解决方案</a>
</li>
<li class="nav-item">
<a class="nav-link" href="cases.html">客户案例</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">关于我们</a>
</li>
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<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>
<!-- 面包屑导航 -->
<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-5 bg-light">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6">
<h1 class="display-5 fw-bold mb-4">合作伙伴</h1>
<p class="lead">携手共建活牛采购数字化生态,与行业领先企业建立战略合作关系,共同推动行业发展。</p>
<div class="mt-4">
<a href="#partnership-programs" class="btn btn-primary btn-lg me-3">
<i class="fas fa-handshake me-2"></i>合作计划
</a>
<a href="#become-partner" class="btn btn-outline-primary btn-lg">
<i class="fas fa-user-plus me-2"></i>成为伙伴
</a>
</div>
</div>
<div class="col-lg-6">
<img src="images/partners-banner.jpg" alt="合作伙伴" class="img-fluid rounded shadow img-hover-zoom" loading="lazy">
</div>
</div>
</div>
</section>
<!-- 合作伙伴价值 -->
<section class="py-5">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">合作价值</h2>
<p class="text-muted">与活牛采购智能系统合作,共创共赢</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-primary bg-opacity-10 text-primary mb-4 mx-auto">
<i class="fas fa-chart-line"></i>
</div>
<h5>业务增长</h5>
<p class="text-muted">通过数字化平台获得更多采购订单,提升业务规模</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-success bg-opacity-10 text-success mb-4 mx-auto">
<i class="fas fa-cogs"></i>
</div>
<h5>效率提升</h5>
<p class="text-muted">自动化采购流程,减少人工操作,提高工作效率</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-info bg-opacity-10 text-info mb-4 mx-auto">
<i class="fas fa-shield-alt"></i>
</div>
<h5>风险控制</h5>
<p class="text-muted">智能风控系统帮助识别和防范采购风险</p>
</div>
</div>
</div>
</div>
</section>
<!-- 合作伙伴类型 -->
<section id="partnership-programs" class="py-5 bg-light">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">合作计划</h2>
<p class="text-muted">多种合作模式,满足不同企业需求</p>
</div>
<div class="row g-4">
<div class="col-md-6">
<div class="card border-0 h-100">
<div class="card-body text-center">
<div class="feature-icon bg-warning bg-opacity-10 text-warning mb-4 mx-auto">
<i class="fas fa-farm"></i>
</div>
<h4 class="card-title">养殖企业伙伴</h4>
<p class="card-text">
为养殖企业提供稳定的销售渠道,实现产销对接数字化管理
</p>
<ul class="list-unstyled text-start">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>优先采购权</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>价格保护机制</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>技术培训支持</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>品牌联合推广</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card border-0 h-100">
<div class="card-body text-center">
<div class="feature-icon bg-danger bg-opacity-10 text-danger mb-4 mx-auto">
<i class="fas fa-industry"></i>
</div>
<h4 class="card-title">屠宰加工伙伴</h4>
<p class="card-text">
为屠宰加工企业提供优质活牛货源,保障生产供应稳定
</p>
<ul class="list-unstyled text-start">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>货源优先保障</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>质量追溯体系</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>定制化采购服务</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>供应链金融支持</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card border-0 h-100">
<div class="card-body text-center">
<div class="feature-icon bg-info bg-opacity-10 text-info mb-4 mx-auto">
<i class="fas fa-truck"></i>
</div>
<h4 class="card-title">物流运输伙伴</h4>
<p class="card-text">
专业的活牛运输服务,确保运输过程安全、高效
</p>
<ul class="list-unstyled text-start">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>稳定运输订单</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>智能调度系统</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>运输过程监控</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>保险保障服务</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card border-0 h-100">
<div class="card-body text-center">
<div class="feature-icon bg-success bg-opacity-10 text-success mb-4 mx-auto">
<i class="fas fa-hand-holding-usd"></i>
</div>
<h4 class="card-title">金融服务伙伴</h4>
<p class="card-text">
为产业链企业提供专业的金融服务解决方案
</p>
<ul class="list-unstyled text-start">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>供应链金融服务</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>信用评估体系</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>风险控制支持</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>资金结算服务</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 合作伙伴展示 -->
<section class="py-5">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">合作伙伴展示</h2>
<p class="text-muted">与行业领先企业建立战略合作关系</p>
</div>
<div class="row g-4">
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner1.jpg" alt="某某养殖集团" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某养殖集团</h6>
<p class="partner-type text-muted small">养殖企业伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner2.jpg" alt="某某食品公司" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某食品公司</h6>
<p class="partner-type text-muted small">屠宰加工伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner3.jpg" alt="某某物流公司" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某物流公司</h6>
<p class="partner-type text-muted small">物流运输伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner4.jpg" alt="某某银行" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某银行</h6>
<p class="partner-type text-muted small">金融服务伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner5.jpg" alt="某某科技公司" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某科技公司</h6>
<p class="partner-type text-muted small">技术服务伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner6.jpg" alt="某某保险公司" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某保险公司</h6>
<p class="partner-type text-muted small">保险服务伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner7.jpg" alt="某某检测机构" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某检测机构</h6>
<p class="partner-type text-muted small">质量检测伙伴</p>
</div>
</div>
<div class="col-md-3 col-6">
<div class="partner-card text-center">
<div class="partner-logo mb-3">
<img src="images/partner8.jpg" alt="某某行业协会" class="img-fluid" loading="lazy">
</div>
<h6 class="partner-name">某某行业协会</h6>
<p class="partner-type text-muted small">行业组织伙伴</p>
</div>
</div>
</div>
</div>
</section>
<!-- 成为合作伙伴 -->
<section id="become-partner" class="py-5 bg-light">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">成为合作伙伴</h2>
<p class="text-muted">加入我们,共创活牛采购数字化未来</p>
</div>
<div class="row">
<div class="col-lg-8 mx-auto">
<div class="card border-0">
<div class="card-body">
<h4 class="mb-4">合作流程</h4>
<div class="process-steps">
<div class="process-step">
<div class="step-number">1</div>
<div class="step-content">
<h5>提交申请</h5>
<p>填写合作伙伴申请表,提供企业基本信息和合作意向</p>
</div>
</div>
<div class="process-step">
<div class="step-number">2</div>
<div class="step-content">
<h5>资质审核</h5>
<p>我们的团队将对您的申请进行审核,评估合作可行性</p>
</div>
</div>
<div class="process-step">
<div class="step-number">3</div>
<div class="step-content">
<h5>商务洽谈</h5>
<p>双方进行详细商务洽谈,确定合作模式和具体条款</p>
</div>
</div>
<div class="process-step">
<div class="step-number">4</div>
<div class="step-content">
<h5>签约合作</h5>
<p>签署正式合作协议,开启合作之旅</p>
</div>
</div>
<div class="process-step">
<div class="step-number">5</div>
<div class="step-content">
<h5>技术支持</h5>
<p>提供技术培训和系统对接支持,确保顺利合作</p>
</div>
</div>
</div>
<div class="text-center mt-5">
<a href="contact.html" class="btn btn-primary btn-lg">
<i class="fas fa-file-alt me-2"></i>立即申请
</a>
<p class="text-muted mt-3">或发送邮件至niumall@aiotagro.com</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 合作伙伴权益 -->
<section class="py-5">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">合作伙伴权益</h2>
<p class="text-muted">享受全方位的支持和服务</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-primary bg-opacity-10 text-primary mb-4 mx-auto">
<i class="fas fa-headset"></i>
</div>
<h5>专属技术支持</h5>
<p class="text-muted">7×24小时专业技术支持团队</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-success bg-opacity-10 text-success mb-4 mx-auto">
<i class="fas fa-graduation-cap"></i>
</div>
<h5>专业培训</h5>
<p class="text-muted">定期举办技术培训和业务研讨会</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-info bg-opacity-10 text-info mb-4 mx-auto">
<i class="fas fa-bullhorn"></i>
</div>
<h5>市场推广</h5>
<p class="text-muted">联合市场推广和品牌曝光机会</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-warning bg-opacity-10 text-warning mb-4 mx-auto">
<i class="fas fa-chart-line"></i>
</div>
<h5>业务优先</h5>
<p class="text-muted">优先获得平台业务机会和订单</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-danger bg-opacity-10 text-danger mb-4 mx-auto">
<i class="fas fa-cog"></i>
</div>
<h5>定制服务</h5>
<p class="text-muted">根据需求提供定制化解决方案</p>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-secondary bg-opacity-10 text-secondary mb-4 mx-auto">
<i class="fas fa-handshake"></i>
</div>
<h5>资源共享</h5>
<p class="text-muted">共享行业资源和客户网络</p>
</div>
</div>
</div>
</div>
</section>
<!-- 页脚 -->
<footer class="footer">
<div class="container">
<div class="row">
<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="help.html">帮助中心</a></li>
<li class="mb-2"><a href="support.html">在线客服</a></li>
<li class="mb-2"><a href="docs.html">开发者文档</a></li>
<li class="mb-2"><a href="partners.html">合作伙伴</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> 武汉市东湖高新区光谷软件园F2栋</li>
<li class="mb-2"><i class="fas fa-phone me-2"></i> 19971988959</li>
<li class="mb-2"><i class="fas fa-envelope me-2"></i> niumall@aiotagro.com</li>
</ul>
</div>
</div>
<div class="copyright text-center">
<p>&copy; 2023 活牛采购智能数字化系统. 保留所有权利。</p>
</div>
</div>
</footer>
<!-- 返回顶部按钮 -->
<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: 800,
once: true
});
</script>
</body>
</html>

View File

@@ -72,6 +72,15 @@
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

View File

@@ -74,6 +74,15 @@
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>

609
website/support.html Normal file
View File

@@ -0,0 +1,609 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>在线客服 - 活牛采购智能数字化系统</title>
<meta name="description" content="活牛采购智能数字化系统在线客服提供7×24小时专业技术支持解答产品使用、技术集成、业务合作等问题。">
<meta name="keywords" content="在线客服,技术支持,客户服务,帮助中心,问题解答,活牛采购系统">
<!-- Bootstrap 5 CSS -->
<link href="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap Icons -->
<link href="https://cdn.bootcdn.net/ajax/libs/bootstrap-icons/1.11.0/font/bootstrap-icons.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet">
<!-- AOS Animation -->
<link href="https://cdn.bootcdn.net/ajax/libs/aos/2.3.4/aos.css" rel="stylesheet">
<!-- 自定义样式 -->
<link href="css/custom.css" rel="stylesheet">
</head>
<body>
<!-- 导航栏 -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top shadow-sm">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="index.html">
<div class="logo-container me-2">
<i class="fas fa-cow text-primary fs-2"></i>
</div>
<div class="brand-text">
<div class="brand-name fw-bold">NiuMall</div>
<div class="brand-subtitle">活牛采购智能系统</div>
</div>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="product.html">产品介绍</a>
</li>
<li class="nav-item">
<a class="nav-link" href="solutions.html">解决方案</a>
</li>
<li class="nav-item">
<a class="nav-link" href="cases.html">客户案例</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">关于我们</a>
</li>
<li class="nav-item">
<a class="nav-link" href="news.html">新闻动态</a>
</li>
<li class="nav-item">
<a class="nav-link" href="docs.html">开发者文档</a>
</li>
<li class="nav-item">
<a class="nav-link" href="partners.html">合作伙伴</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="support.html">在线客服</a>
</li>
<li class="nav-item">
<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>
<!-- 面包屑导航 -->
<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-5 bg-light">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6">
<h1 class="display-5 fw-bold mb-4">在线客服</h1>
<p class="lead">7×24小时专业技术支持随时为您解答产品使用、技术集成、业务合作等问题。</p>
<div class="mt-4">
<a href="#live-chat" class="btn btn-primary btn-lg me-3">
<i class="fas fa-comments me-2"></i>在线咨询
</a>
<a href="#contact-methods" class="btn btn-outline-primary btn-lg">
<i class="fas fa-headset me-2"></i>联系客服
</a>
</div>
</div>
<div class="col-lg-6">
<img src="images/support-banner.jpg" alt="在线客服" class="img-fluid rounded shadow img-hover-zoom" loading="lazy">
</div>
</div>
</div>
</section>
<!-- 客服服务类型 -->
<section class="py-5">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">服务类型</h2>
<p class="text-muted">全方位的客户服务支持</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-primary bg-opacity-10 text-primary mb-4 mx-auto">
<i class="fas fa-cog"></i>
</div>
<h5>技术支持</h5>
<p class="text-muted">系统使用、API集成、技术问题解答</p>
<ul class="list-unstyled text-start mt-3">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>API使用指导</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>系统配置帮助</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>故障排除支持</li>
</ul>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-success bg-opacity-10 text-success mb-4 mx-auto">
<i class="fas fa-shopping-cart"></i>
</div>
<h5>业务咨询</h5>
<p class="text-muted">产品功能、业务流程、合作模式咨询</p>
<ul class="list-unstyled text-start mt-3">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>产品功能说明</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>业务流程指导</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>合作模式咨询</li>
</ul>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-info bg-opacity-10 text-info mb-4 mx-auto">
<i class="fas fa-file-invoice"></i>
</div>
<h5>售后服务</h5>
<p class="text-muted">订单管理、发票申请、售后问题处理</p>
<ul class="list-unstyled text-start mt-3">
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>订单查询协助</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>发票申请支持</li>
<li class="mb-2"><i class="fas fa-check text-success me-2"></i>售后问题处理</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- 在线聊天系统 -->
<section id="live-chat" class="py-5 bg-light">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">在线咨询</h2>
<p class="text-muted">实时与客服人员沟通,快速解决问题</p>
</div>
<div class="row">
<div class="col-lg-8 mx-auto">
<div class="card border-0">
<div class="card-body">
<div class="chat-container">
<div class="chat-header bg-primary text-white p-3 rounded-top">
<div class="d-flex align-items-center">
<div class="avatar me-3">
<i class="fas fa-headset fs-4"></i>
</div>
<div>
<h6 class="mb-0">活牛采购智能系统客服</h6>
<small>在线状态:<span class="badge bg-success">在线</span></small>
</div>
</div>
</div>
<div class="chat-messages p-3" style="height: 300px; overflow-y: auto;">
<div class="message system-message">
<div class="message-content">
<p class="mb-0">您好!欢迎使用活牛采购智能系统在线客服。请问有什么可以帮您?</p>
</div>
<div class="message-time text-muted small">系统消息 10:00</div>
</div>
<div class="message user-message">
<div class="message-content">
<p class="mb-0">我想了解一下如何创建采购订单?</p>
</div>
<div class="message-time text-muted small">您 10:01</div>
</div>
<div class="message system-message">
<div class="message-content">
<p class="mb-0">创建采购订单非常简单:<br>
1. 登录系统后进入"采购管理"<br>
2. 点击"新建订单"<br>
3. 选择供应商和产品类型<br>
4. 填写采购数量和价格<br>
5. 确认提交即可</p>
</div>
<div class="message-time text-muted small">客服 10:02</div>
</div>
</div>
<div class="chat-input p-3 border-top">
<div class="input-group">
<input type="text" class="form-control" placeholder="请输入您的问题..." aria-label="输入消息">
<button class="btn btn-primary" type="button">
<i class="fas fa-paper-plane"></i>
</button>
</div>
</div>
</div>
<div class="mt-4">
<div class="alert alert-info">
<i class="fas fa-info-circle me-2"></i>
当前为演示模式,如需真实在线客服支持,请通过下方联系方式联系我们。
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 常见问题 -->
<section class="py-5">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">常见问题</h2>
<p class="text-muted">快速找到您需要的答案</p>
</div>
<div class="row">
<div class="col-lg-10 mx-auto">
<div class="accordion" id="faqAccordion">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#faq1">
如何注册账号?
</button>
</h2>
<div id="faq1" class="accordion-collapse collapse show" data-bs-parent="#faqAccordion">
<div class="accordion-body">
<p>注册账号非常简单:</p>
<ol>
<li>访问官网首页,点击"免费试用"按钮</li>
<li>填写企业基本信息和管理员联系方式</li>
<li>提交申请后,我们的客服人员会与您联系</li>
<li>完成资质审核后即可开通账号</li>
</ol>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq2">
系统支持哪些支付方式?
</button>
</h2>
<div id="faq2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
<p>我们支持多种支付方式:</p>
<ul>
<li>银行转账</li>
<li>在线支付(支付宝、微信支付)</li>
<li>信用证</li>
<li>供应链金融服务</li>
</ul>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq3">
如何集成API
</button>
</h2>
<div id="faq3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
<p>API集成步骤</p>
<ol>
<li>在管理后台申请API密钥</li>
<li>下载对应语言的SDK</li>
<li>参考开发者文档进行集成</li>
<li>进行测试环境验证</li>
<li>切换至生产环境使用</li>
</ol>
<p>详细指南请查看<a href="docs.html">开发者文档</a></p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq4">
订单状态有哪些?
</button>
</h2>
<div id="faq4" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
<p>订单状态包括:</p>
<ul>
<li><strong>待确认</strong> - 订单已提交,等待供应商确认</li>
<li><strong>已确认</strong> - 供应商已确认订单</li>
<li><strong>配送中</strong> - 货物正在运输途中</li>
<li><strong>已完成</strong> - 订单已完成交付</li>
<li><strong>已取消</strong> - 订单已被取消</li>
<li><strong>异常</strong> - 订单出现异常情况</li>
</ul>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq5">
如何申请发票?
</button>
</h2>
<div id="faq5" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
<p>发票申请流程:</p>
<ol>
<li>登录系统进入"财务管理"</li>
<li>选择需要开票的订单</li>
<li>点击"申请发票"</li>
<li>填写发票信息和邮寄地址</li>
<li>提交申请财务部门会在3个工作日内处理</li>
</ol>
</div>
</div>
</div>
</div>
<div class="text-center mt-4">
<a href="help.html" class="btn btn-outline-primary">
<i class="fas fa-book me-2"></i>查看更多问题
</a>
</div>
</div>
</div>
</div>
</section>
<!-- 联系方式 -->
<section id="contact-methods" class="py-5 bg-light">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">联系我们</h2>
<p class="text-muted">多种联系方式,随时为您服务</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-primary bg-opacity-10 text-primary mb-4 mx-auto">
<i class="fas fa-phone"></i>
</div>
<h5>电话支持</h5>
<p class="text-muted">19971988959</p>
<p class="small text-muted">工作日 9:00-18:00</p>
<a href="tel:19971988959" class="btn btn-primary mt-3">
<i class="fas fa-phone me-2"></i>立即拨打
</a>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-success bg-opacity-10 text-success mb-4 mx-auto">
<i class="fas fa-envelope"></i>
</div>
<h5>邮件支持</h5>
<p class="text-muted">niumall@aiotagro.com</p>
<p class="small text-muted">24小时内回复</p>
<a href="mailto:niumall@aiotagro.com" class="btn btn-success mt-3">
<i class="fas fa-envelope me-2"></i>发送邮件
</a>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 h-100 text-center p-4">
<div class="feature-icon bg-info bg-opacity-10 text-info mb-4 mx-auto">
<i class="fab fa-weixin"></i>
</div>
<h5>微信支持</h5>
<p class="text-muted">扫描二维码添加客服微信</p>
<div class="qr-code mb-3">
<img src="images/wechat-qr.jpg" alt="客服微信" class="img-fluid" style="max-width: 120px;">
</div>
<p class="small text-muted">实时在线沟通</p>
</div>
</div>
</div>
<div class="row mt-5">
<div class="col-lg-8 mx-auto">
<div class="card border-0">
<div class="card-body">
<h4 class="mb-4">服务时间</h4>
<div class="row">
<div class="col-md-6">
<h6>电话支持</h6>
<p class="text-muted">工作日9:00 - 18:00<br>周末10:00 - 17:00</p>
</div>
<div class="col-md-6">
<h6>在线客服</h6>
<p class="text-muted">7×24小时智能客服<br>人工客服9:00 - 21:00</p>
</div>
</div>
<div class="row mt-3">
<div class="col-md-6">
<h6>邮件支持</h6>
<p class="text-muted">24小时内回复<br>紧急问题请标注"紧急"</p>
</div>
<div class="col-md-6">
<h6>现场支持</h6>
<p class="text-muted">需提前预约<br>仅限企业版客户</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 客户满意度 -->
<section class="py-5">
<div class="container">
<div class="text-center mb-5">
<h2 class="display-6 mb-3">客户满意度</h2>
<p class="text-muted">我们致力于提供最优质的客户服务</p>
</div>
<div class="row g-4">
<div class="col-md-3 col-6 text-center">
<div class="stat-number display-6 fw-bold text-primary">98%</div>
<p class="text-muted">问题解决率</p>
</div>
<div class="col-md-3 col-6 text-center">
<div class="stat-number display-6 fw-bold text-success">15min</div>
<p class="text-muted">平均响应时间</p>
</div>
<div class="col-md-3 col-6 text-center">
<div class="stat-number display-6 fw-bold text-info">4.9/5</div>
<p class="text-muted">客户满意度</p>
</div>
<div class="col-md-3 col-6 text-center">
<div class="stat-number display-6 fw-bold text-warning">5000+</div>
<p class="text-muted">服务客户数</p>
</div>
</div>
</div>
</section>
<!-- 页脚 -->
<footer class="footer">
<div class="container">
<div class="row">
<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="help.html">帮助中心</a></li>
<li class="mb-2"><a href="support.html">在线客服</a></li>
<li class="mb-2"><a href="docs.html">开发者文档</a></li>
<li class="mb-2"><a href="partners.html">合作伙伴</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> 武汉市东湖高新区光谷软件园F2栋</li>
<li class="mb-2"><i class="fas fa-phone me-2"></i> 19971988959</li>
<li class="mb-2"><i class="fas fa-envelope me-2"></i> niumall@aiotagro.com</li>
</ul>
</div>
</div>
<div class="copyright text-center">
<p>&copy; 2023 活牛采购智能数字化系统. 保留所有权利。</p>
</div>
<div class="text-center">
<p class="text-muted small">鄂ICP备2023000000号-1</p>
</div>
</div>
</footer>
<!-- 返回顶部按钮 -->
<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: 800,
once: true
});
// 模拟聊天功能
document.addEventListener('DOMContentLoaded', function() {
const chatInput = document.querySelector('.chat-input input');
const sendButton = document.querySelector('.chat-input button');
const chatMessages = document.querySelector('.chat-messages');
sendButton.addEventListener('click', function() {
const message = chatInput.value.trim();
if (message) {
// 添加用户消息
const userMessage = document.createElement('div');
userMessage.className = 'message user-message';
userMessage.innerHTML = `
<div class="message-content">
<p class="mb-0">${message}</p>
</div>
<div class="message-time text-muted small">您 ${new Date().toLocaleTimeString()}</div>
`;
chatMessages.appendChild(userMessage);
// 清空输入框
chatInput.value = '';
// 模拟客服回复
setTimeout(() => {
const systemMessage = document.createElement('div');
systemMessage.className = 'message system-message';
systemMessage.innerHTML = `
<div class="message-content">
<p class="mb-0">感谢您的咨询我们的客服人员会尽快回复您。如需即时帮助请拨打19971988959。</p>
</div>
<div class="message-time text-muted small">客服 ${new Date().toLocaleTimeString()}</div>
`;
chatMessages.appendChild(systemMessage);
// 滚动到底部
chatMessages.scrollTop = chatMessages.scrollHeight;
}, 1000);
// 滚动到底部
chatMessages.scrollTop = chatMessages.scrollHeight;
}
});
// 支持回车发送
chatInput.addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
sendButton.click();
}
});
});
</script>
</body>
</html>