Files
niumalll/website/contact.html

853 lines
56 KiB
HTML
Raw Normal View History

<!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="联系我们,产品演示,报价咨询,技术支持,客服热线,在线咨询,免费试用,预约演示">
<!-- 结构化数据 -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "活牛采购智能数字化系统",
"description": "联系活牛采购智能数字化系统团队,获取产品演示、报价咨询和技术支持,我们为您提供专业的数字化采购解决方案。",
"url": "https://www.niumall.com",
"logo": "https://www.niumall.com/images/logo.png",
"contactPoint": {
"@type": "ContactPoint",
"telephone": "400-xxx-xxxx",
"contactType": "customer service"
},
"address": {
"@type": "PostalAddress",
"streetAddress": "xxx街道xxx号",
"addressLocality": "北京市",
"postalCode": "100000",
"addressCountry": "CN"
}
}
</script>
<!-- Bootstrap 5 CSS -->
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome Icons -->
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.7.2/css/all.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 active" 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">
<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>
<p>无论您是想了解产品信息、申请试用、预约演示还是获取技术支持,我们的专业团队都将竭诚为您服务。</p>
<div class="mt-4">
<a href="#contact-form" class="btn btn-primary btn-lg me-3">
<i class="fas fa-envelope me-2"></i>在线留言
</a>
<a href="#online-service" class="btn btn-outline-primary btn-lg">
<i class="fas fa-comments me-2"></i>在线客服
</a>
</div>
</div>
<div class="col-lg-6">
<div class="row g-3">
<div class="col-6">
<div class="bg-primary bg-opacity-10 p-3 rounded text-center h-100">
<div class="stat-number display-6 text-primary mb-2 count-up" data-target="1000">0</div>
<div class="stat-label">满意客户</div>
</div>
</div>
<div class="col-6">
<div class="bg-success bg-opacity-10 p-3 rounded text-center h-100">
<div class="stat-number display-6 text-success mb-2 count-up" data-target="98" data-suffix="%">0%</div>
<div class="stat-label">响应及时率</div>
</div>
</div>
<div class="col-6">
<div class="bg-warning bg-opacity-10 p-3 rounded text-center h-100">
<div class="stat-number display-6 text-warning mb-2 count-up" data-target="24">0</div>
<div class="stat-label">小时支持</div>
</div>
</div>
<div class="col-6">
<div class="bg-info bg-opacity-10 p-3 rounded text-center h-100">
<div class="stat-number display-6 text-info mb-2 count-up" data-target="50">0</div>
<div class="stat-label">专业顾问</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 联系方式 -->
<section 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 shadow-sm h-100">
<div class="card-body text-center">
<div class="feature-icon bg-primary bg-opacity-10 text-primary mb-4 mx-auto">
<i class="fas fa-map-marker-alt"></i>
</div>
<h5 class="card-title">公司地址</h5>
<p class="card-text">北京市朝阳区xxx街道xxx号<br>邮编100000</p>
<a href="#map" class="btn btn-outline-primary btn-sm">查看地图</a>
</div>
</div>
</div>
<!-- 联系电话 -->
<div class="col-md-4">
<div class="card border-0 shadow-sm 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-phone-alt"></i>
</div>
<h5 class="card-title">联系电话</h5>
<p class="card-text">客服热线400-xxx-xxxx<br>技术支持010-xxxx-xxxx<br>商务合作010-xxxx-xxxx</p>
<a href="tel:400xxx xxxx" class="btn btn-outline-success btn-sm">立即拨打</a>
</div>
</div>
</div>
<!-- 电子邮箱 -->
<div class="col-md-4">
<div class="card border-0 shadow-sm 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-envelope"></i>
</div>
<h5 class="card-title">电子邮箱</h5>
<p class="card-text">商务咨询info@example.com<br>技术支持support@example.com<br>媒体合作media@example.com</p>
<a href="mailto:info@example.com" class="btn btn-outline-info btn-sm">发送邮件</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 在线客服系统 -->
<section id="online-service" 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 justify-content-center">
<div class="col-lg-8">
<div class="card border-0 shadow-sm">
<div class="card-body">
<div class="d-flex justify-content-between align-items-center mb-4">
<h5 class="card-title mb-0">在线客服系统</h5>
<div class="d-flex align-items-center">
<div class="bg-success rounded-circle me-2" style="width: 10px; height: 10px;"></div>
<small class="text-muted">在线</small>
</div>
</div>
<div class="chat-container bg-light p-3 rounded mb-3" style="height: 300px; overflow-y: auto;">
<div class="chat-message mb-3">
<div class="d-flex">
<div class="bg-primary text-white rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px; flex-shrink: 0;">
<i class="fas fa-robot"></i>
</div>
<div class="bg-white p-3 rounded">
<p class="mb-0">您好!欢迎联系活牛采购智能数字化系统客服。请问有什么可以帮助您的吗?</p>
<small class="text-muted">09:00</small>
</div>
</div>
</div>
<div class="chat-message mb-3">
<div class="d-flex justify-content-end">
<div class="bg-primary text-white p-3 rounded me-2">
<p class="mb-0">我想了解产品的价格和功能</p>
<small class="text-white-50">09:01</small>
</div>
<div class="bg-primary text-white rounded-circle d-flex align-items-center justify-content-center" style="width: 30px; height: 30px; flex-shrink: 0;">
<i class="fas fa-user"></i>
</div>
</div>
</div>
<div class="chat-message mb-3">
<div class="d-flex">
<div class="bg-primary text-white rounded-circle d-flex align-items-center justify-content-center me-2" style="width: 30px; height: 30px; flex-shrink: 0;">
<i class="fas fa-robot"></i>
</div>
<div class="bg-white p-3 rounded">
<p class="mb-0">我们的产品提供多种版本,包括基础版、标准版和企业版,价格根据用户规模和功能需求而定。您可以先申请免费试用,体验产品功能后再做决定。</p>
<small class="text-muted">09:02</small>
</div>
</div>
</div>
</div>
<div class="input-group">
<input type="text" class="form-control" placeholder="输入您的问题...">
<button class="btn btn-primary" type="button">
<i class="fas fa-paper-plane"></i>
</button>
</div>
<div class="mt-3">
<small class="text-muted">工作时间:周一至周五 9:00-18:00</small>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 联系表单 -->
<section id="contact-form" 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-8 mx-auto">
<div class="card border-0 shadow-sm">
<div class="card-body">
<ul class="nav nav-tabs mb-4" id="contactTab" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="message-tab" data-bs-toggle="tab" data-bs-target="#message" type="button" role="tab">在线留言</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="demo-tab" data-bs-toggle="tab" data-bs-target="#demo" type="button" role="tab">预约演示</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="trial-tab" data-bs-toggle="tab" data-bs-target="#trial" type="button" role="tab">免费试用</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="download-tab" data-bs-toggle="tab" data-bs-target="#download" type="button" role="tab">资料下载</button>
</li>
</ul>
<div class="tab-content" id="contactTabContent">
<!-- 在线留言 -->
<div class="tab-pane fade show active" id="message" role="tabpanel">
<form id="messageForm" class="needs-validation" novalidate>
<div class="row g-3">
<div class="col-md-6">
<label for="name" class="form-label">姓名 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="name" required>
<div class="invalid-feedback">请输入您的姓名</div>
</div>
<div class="col-md-6">
<label for="company" class="form-label">公司名称</label>
<input type="text" class="form-control" id="company">
</div>
<div class="col-md-6">
<label for="phone" class="form-label">联系电话 <span class="text-danger">*</span></label>
<input type="tel" class="form-control" id="phone" required>
<div class="invalid-feedback">请输入您的联系电话</div>
</div>
<div class="col-md-6">
<label for="email" class="form-label">电子邮箱 <span class="text-danger">*</span></label>
<input type="email" class="form-control" id="email" required>
<div class="invalid-feedback">请输入有效的电子邮箱</div>
</div>
<div class="col-12">
<label for="subject" class="form-label">主题 <span class="text-danger">*</span></label>
<select class="form-select" id="subject" required>
<option value="">请选择</option>
<option value="product">产品咨询</option>
<option value="demo">产品演示</option>
<option value="price">报价咨询</option>
<option value="support">技术支持</option>
<option value="other">其他</option>
</select>
<div class="invalid-feedback">请选择咨询主题</div>
</div>
<div class="col-12">
<label for="messageContent" class="form-label">留言内容 <span class="text-danger">*</span></label>
<textarea class="form-control" id="messageContent" rows="5" required></textarea>
<div class="invalid-feedback">请输入留言内容</div>
</div>
<div class="col-12">
<button class="btn btn-primary btn-lg" type="submit">
<span class="loading-spinner d-none me-2" role="status" aria-hidden="true"></span>
提交留言
</button>
</div>
</div>
</form>
</div>
<!-- 预约演示 -->
<div class="tab-pane fade" id="demo" role="tabpanel">
<form id="demoForm" class="needs-validation" novalidate>
<div class="row g-3">
<div class="col-md-6">
<label for="demoName" class="form-label">姓名 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="demoName" required>
<div class="invalid-feedback">请输入您的姓名</div>
</div>
<div class="col-md-6">
<label for="demoCompany" class="form-label">公司名称 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="demoCompany" required>
<div class="invalid-feedback">请输入公司名称</div>
</div>
<div class="col-md-6">
<label for="demoPhone" class="form-label">联系电话 <span class="text-danger">*</span></label>
<input type="tel" class="form-control" id="demoPhone" required>
<div class="invalid-feedback">请输入您的联系电话</div>
</div>
<div class="col-md-6">
<label for="demoEmail" class="form-label">电子邮箱 <span class="text-danger">*</span></label>
<input type="email" class="form-control" id="demoEmail" required>
<div class="invalid-feedback">请输入有效的电子邮箱</div>
</div>
<div class="col-md-6">
<label for="demoDate" class="form-label">预约日期 <span class="text-danger">*</span></label>
<input type="date" class="form-control" id="demoDate" required>
<div class="invalid-feedback">请选择预约日期</div>
</div>
<div class="col-md-6">
<label for="demoTime" class="form-label">预约时间 <span class="text-danger">*</span></label>
<select class="form-select" id="demoTime" required>
<option value="">请选择</option>
<option value="09:00-10:00">09:00-10:00</option>
<option value="10:00-11:00">10:00-11:00</option>
<option value="11:00-12:00">11:00-12:00</option>
<option value="14:00-15:00">14:00-15:00</option>
<option value="15:00-16:00">15:00-16:00</option>
<option value="16:00-17:00">16:00-17:00</option>
</select>
<div class="invalid-feedback">请选择预约时间</div>
</div>
<div class="col-12">
<label for="demoParticipants" class="form-label">参会人员及职位</label>
<textarea class="form-control" id="demoParticipants" rows="3" placeholder="请列出参会人员姓名及职位"></textarea>
</div>
<div class="col-12">
<label for="demoRequirements" class="form-label">特殊需求</label>
<textarea class="form-control" id="demoRequirements" rows="3" placeholder="如有特殊演示需求,请在此说明"></textarea>
</div>
<div class="col-12">
<button class="btn btn-primary btn-lg" type="submit">
<span class="loading-spinner d-none me-2" role="status" aria-hidden="true"></span>
预约演示
</button>
</div>
</div>
</form>
</div>
<!-- 免费试用 -->
<div class="tab-pane fade" id="trial" role="tabpanel">
<form id="trialForm" class="needs-validation" novalidate>
<div class="row g-3">
<div class="col-md-6">
<label for="trialName" class="form-label">姓名 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="trialName" required>
<div class="invalid-feedback">请输入您的姓名</div>
</div>
<div class="col-md-6">
<label for="trialCompany" class="form-label">公司名称 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="trialCompany" required>
<div class="invalid-feedback">请输入公司名称</div>
</div>
<div class="col-md-6">
<label for="trialPhone" class="form-label">联系电话 <span class="text-danger">*</span></label>
<input type="tel" class="form-control" id="trialPhone" required>
<div class="invalid-feedback">请输入您的联系电话</div>
</div>
<div class="col-md-6">
<label for="trialEmail" class="form-label">电子邮箱 <span class="text-danger">*</span></label>
<input type="email" class="form-control" id="trialEmail" required>
<div class="invalid-feedback">请输入有效的电子邮箱</div>
</div>
<div class="col-md-6">
<label for="trialScale" class="form-label">企业规模 <span class="text-danger">*</span></label>
<select class="form-select" id="trialScale" required>
<option value="">请选择</option>
<option value="small">小型企业(年采购量&lt;200头</option>
<option value="medium">中型企业年采购量200-1000头</option>
<option value="large">大型企业年采购量1000-5000头</option>
<option value="group">集团公司(年采购量&gt;5000头</option>
</select>
<div class="invalid-feedback">请选择企业规模</div>
</div>
<div class="col-md-6">
<label for="trialRole" class="form-label">您的角色 <span class="text-danger">*</span></label>
<select class="form-select" id="trialRole" required>
<option value="">请选择</option>
<option value="purchaser">采购人员</option>
<option value="manager">管理人员</option>
<option value="it">IT人员</option>
<option value="owner">企业主</option>
<option value="other">其他</option>
</select>
<div class="invalid-feedback">请选择您的角色</div>
</div>
<div class="col-12">
<label for="trialRequirements" class="form-label">试用需求说明</label>
<textarea class="form-control" id="trialRequirements" rows="3" placeholder="请说明您希望重点体验的功能模块"></textarea>
</div>
<div class="col-12">
<div class="form-check mb-3">
<input class="form-check-input" type="checkbox" id="agreeTerms" required>
<label class="form-check-label" for="agreeTerms">
我已阅读并同意 <a href="#" class="text-primary">服务条款</a><a href="#" class="text-primary">隐私政策</a> <span class="text-danger">*</span>
</label>
<div class="invalid-feedback">请同意服务条款和隐私政策</div>
</div>
<button class="btn btn-primary btn-lg" type="submit">
<span class="loading-spinner d-none me-2" role="status" aria-hidden="true"></span>
申请免费试用
</button>
</div>
</div>
</form>
</div>
<!-- 资料下载 -->
<div class="tab-pane fade" id="download" role="tabpanel">
<div class="row g-4">
<div class="col-md-6">
<div class="card border-0 shadow-sm h-100">
<div class="card-body text-center">
<div class="feature-icon bg-primary bg-opacity-10 text-primary mb-4 mx-auto">
<i class="fas fa-book"></i>
</div>
<h5 class="card-title">产品手册</h5>
<p class="card-text text-muted">详细的产品功能介绍和使用指南</p>
<button class="btn btn-outline-primary download-btn" data-file="product-manual">
<i class="fas fa-download me-2"></i>下载PDF
</button>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card border-0 shadow-sm 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-file-alt"></i>
</div>
<h5 class="card-title">技术白皮书</h5>
<p class="card-text text-muted">系统架构和技术实现方案详解</p>
<button class="btn btn-outline-success download-btn" data-file="white-paper">
<i class="fas fa-download me-2"></i>下载PDF
</button>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card border-0 shadow-sm 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-chart-bar"></i>
</div>
<h5 class="card-title">案例研究报告</h5>
<p class="card-text text-muted">典型客户成功案例深度分析</p>
<button class="btn btn-outline-warning download-btn" data-file="case-study">
<i class="fas fa-download me-2"></i>下载PDF
</button>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card border-0 shadow-sm 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-video"></i>
</div>
<h5 class="card-title">产品演示视频</h5>
<p class="card-text text-muted">系统功能演示和操作指南视频</p>
<button class="btn btn-outline-info download-btn" data-file="demo-video">
<i class="fas fa-download me-2"></i>下载视频
</button>
</div>
</div>
</div>
</div>
<!-- 资料下载表单 -->
<div class="card border-0 shadow-sm mt-4">
<div class="card-body">
<h5 class="card-title mb-4">填写信息获取资料</h5>
<form id="downloadForm" class="needs-validation" novalidate>
<div class="row g-3">
<div class="col-md-6">
<label for="downloadName" class="form-label">姓名 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="downloadName" required>
<div class="invalid-feedback">请输入您的姓名</div>
</div>
<div class="col-md-6">
<label for="downloadCompany" class="form-label">公司名称 <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="downloadCompany" required>
<div class="invalid-feedback">请输入公司名称</div>
</div>
<div class="col-md-6">
<label for="downloadPhone" class="form-label">联系电话 <span class="text-danger">*</span></label>
<input type="tel" class="form-control" id="downloadPhone" required>
<div class="invalid-feedback">请输入您的联系电话</div>
</div>
<div class="col-md-6">
<label for="downloadEmail" class="form-label">电子邮箱 <span class="text-danger">*</span></label>
<input type="email" class="form-control" id="downloadEmail" required>
<div class="invalid-feedback">请输入有效的电子邮箱</div>
</div>
<div class="col-12">
<label for="downloadInterests" class="form-label">感兴趣的资料 <span class="text-danger">*</span></label>
<select class="form-select" id="downloadInterests" multiple required>
<option value="product-manual">产品手册</option>
<option value="white-paper">技术白皮书</option>
<option value="case-study">案例研究报告</option>
<option value="demo-video">产品演示视频</option>
</select>
<div class="invalid-feedback">请选择您感兴趣的资料</div>
<small class="text-muted">按住Ctrl键可多选</small>
</div>
<div class="col-12">
<div class="form-check mb-3">
<input class="form-check-input" type="checkbox" id="downloadAgree" required>
<label class="form-check-label" for="downloadAgree">
我已阅读并同意 <a href="#" class="text-primary">服务条款</a><a href="#" class="text-primary">隐私政策</a> <span class="text-danger">*</span>
</label>
<div class="invalid-feedback">请同意服务条款和隐私政策</div>
</div>
<button class="btn btn-primary btn-lg" type="submit">
<span class="loading-spinner d-none me-2" role="status" aria-hidden="true"></span>
获取资料
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 办公地图 -->
<section id="map" 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-6">
<div class="card border-0 shadow-sm h-100">
<div class="card-body">
<h5 class="card-title mb-4">公司位置</h5>
<div class="ratio ratio-16x9">
<iframe src="https://map.baidu.com/" title="公司位置" loading="lazy"></iframe>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="card border-0 shadow-sm h-100">
<div class="card-body">
<h5 class="card-title mb-4">交通信息</h5>
<div class="mb-4">
<h6 class="text-primary"><i class="fas fa-subway me-2"></i>地铁</h6>
<p class="mb-0">地铁10号线xxx站下车A出口步行500米</p>
</div>
<div class="mb-4">
<h6 class="text-primary"><i class="fas fa-bus me-2"></i>公交</h6>
<p class="mb-0">xxx路、xxx路、xxx路公交xxx站下车</p>
</div>
<div class="mb-4">
<h6 class="text-primary"><i class="fas fa-car me-2"></i>自驾</h6>
<p class="mb-0">导航至北京市朝阳区xxx街道xxx号附近有停车场</p>
</div>
<div>
<h6 class="text-primary"><i class="fas fa-clock me-2"></i>工作时间</h6>
<p class="mb-0">周一至周五9:00 - 18:00</p>
<p class="mb-0">周六至周日10:00 - 16:00</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">
<div class="col-lg-8 mx-auto">
<div class="accordion" id="faqAccordion">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne">
如何获取产品演示?
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show" data-bs-parent="#faqAccordion">
<div class="accordion-body">
您可以通过上方的"预约演示"选项卡填写预约表单我们的销售顾问将在24小时内与您联系并安排演示。您也可以直接致电我们的客服热线400-xxx-xxxx或通过在线客服系统咨询。
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo">
系统支持哪些设备访问?
</button>
</h2>
<div id="collapseTwo" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
我们的系统支持PC端和移动端访问包括Windows、Mac、iOS、Android等主流操作系统。同时我们也提供微信小程序版本方便您随时处理业务。所有版本数据实时同步确保您在任何设备上都能获得一致的使用体验。
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingThree">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree">
如何进行系统部署?
</button>
</h2>
<div id="collapseThree" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
我们提供云部署和本地部署两种方式。云部署由我们负责运维您只需通过浏览器访问即可本地部署需要您的IT团队配合我们提供全程技术支持。无论选择哪种部署方式我们都提供完整的部署文档和技术支持。
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingFour">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour">
系统安全性如何保障?
</button>
</h2>
<div id="collapseFour" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
我们采用多层安全防护机制包括数据加密传输、访问权限控制、定期安全审计等。同时通过了ISO27001信息安全管理体系认证确保您的数据安全。所有数据均存储在阿里云服务器上具备高可用性和灾备能力。
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingFive">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFive">
免费试用期是多长时间?
</button>
</h2>
<div id="collapseFive" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
<div class="accordion-body">
我们提供14天的免费试用期试用期间您可以体验系统的所有功能。试用期结束后如果您需要继续使用我们的销售团队会与您联系讨论后续的合作方案。试用期间有任何问题我们的技术支持团队将全程为您服务。
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 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>
<div class="d-flex flex-wrap justify-content-center gap-3">
<a href="#trial" class="btn btn-light btn-lg">
<i class="fas fa-rocket me-2"></i>免费试用
</a>
<a href="#demo" class="btn btn-outline-light btn-lg">
<i class="fas fa-play-circle me-2"></i>预约演示
</a>
</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="#">帮助中心</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> 武汉市东湖高新区光谷软件园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
});
// 联系表单切换时滚动到表单顶部
document.addEventListener('DOMContentLoaded', function() {
const tabButtons = document.querySelectorAll('[data-bs-toggle="tab"]');
tabButtons.forEach(button => {
button.addEventListener('click', function() {
// 延迟滚动确保tab切换完成
setTimeout(() => {
const formSection = document.getElementById('contact-form');
formSection.scrollIntoView({ behavior: 'smooth' });
}, 100);
});
});
// 资料下载按钮事件
const downloadButtons = document.querySelectorAll('.download-btn');
downloadButtons.forEach(button => {
button.addEventListener('click', function() {
const file = this.getAttribute('data-file');
alert(`资料"${file}"已发送至您的邮箱,请注意查收。`);
});
});
});
</script>
</body>
</html>