This commit is contained in:
张威33321
2026-09-08 15:41:31 +08:00
parent b509b879a4
commit 594b462845
15 changed files with 1140 additions and 13 deletions

130
office-site/support.html Normal file
View File

@@ -0,0 +1,130 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>智能客服 · 泽枢云启</title>
<link rel="icon" href="assets/img/logo.svg">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<header class="header">
<div class="container header-inner">
<a href="index.html" class="logo">
<img src="assets/img/logo.svg" alt="logo">
<span>泽枢云启</span>
</a>
<nav class="nav">
<a href="index.html">首页</a>
<a href="guide.html">使用说明</a>
<a href="report.html">报告查询</a>
<a href="support.html" class="active">智能客服</a>
</nav>
<div class="header-actions">
<a class="btn btn-primary btn-sm" href="report.html">查询报告</a>
</div>
</div>
</header>
<section class="page-banner">
<div class="container">
<h1>智能客服</h1>
<p>7×24 在线,选型建议、故障排查、售后咨询即时响应</p>
</div>
</section>
<section class="section">
<div class="container">
<div class="chat-layout">
<div>
<div class="panel" style="padding:24px">
<h2 style="font-size:18px;margin-bottom:14px">常见问题</h2>
<div class="quick-list" id="quickList">
<div class="quick-item">如何选择合适的系列?</div>
<div class="quick-item">机器无法开机怎么办?</div>
<div class="quick-item">硬盘如何扩容?</div>
<div class="quick-item">怎么查询稳定性测试报告?</div>
<div class="quick-item">质保与售后流程?</div>
</div>
</div>
<div class="panel" style="padding:24px">
<h2 style="font-size:18px;margin-bottom:10px">人工客服</h2>
<p class="desc" style="margin-bottom:14px">服务时间 09:00 - 21:00</p>
<div class="placeholder short">
<span class="ph-title">联系方式位</span>
<span>电话 / 微信 / 二维码</span>
</div>
</div>
</div>
<div class="panel">
<h2>在线对话</h2>
<p class="desc">描述你的问题,智能客服会即时给出建议(示例对话,接口接入后生效)。</p>
<div class="chat-window">
<div class="chat-body" id="chatBody">
<div class="bubble bot">你好,我是泽枢云启 智能客服。请问有什么可以帮你?</div>
<div class="bubble bot">可以问我:选型建议、装机步骤、故障排查、报告查询、质保售后。</div>
</div>
<form class="chat-foot" id="chatForm">
<input class="input" id="chatInput" type="text" placeholder="输入你的问题…" autocomplete="off">
<button class="btn btn-primary btn-sm" type="submit">发送</button>
</form>
</div>
<div class="placeholder short" style="margin-top:20px">
<span class="ph-title">知识库 / 推荐内容位</span>
<span>后续可接入产品文档、教程卡片</span>
</div>
</div>
</div>
</div>
</section>
<footer class="footer">
<div class="container">
<div class="footer-cols">
<div class="brand">
<a href="index.html" class="logo">
<img src="assets/img/logo.svg" alt="logo">
<span>泽枢云启</span>
</a>
<p>专注个人与家庭数据存储设备,提供稳定可靠的 NAS 整机与全流程服务支持。</p>
</div>
<div>
<h5>服务支持</h5>
<ul>
<li><a href="guide.html">使用说明</a></li>
<li><a href="report.html">报告查询</a></li>
<li><a href="support.html">智能客服</a></li>
</ul>
</div>
<div>
<h5>产品</h5>
<ul>
<li>云启系列</li>
<li>云优系列</li>
<li>云卓系列</li>
</ul>
</div>
<div>
<h5>关于</h5>
<ul>
<li>公司简介</li>
<li>联系我们</li>
<li>加入我们</li>
</ul>
</div>
</div>
<div class="footer-bottom">
© 2026 泽枢云启 保留所有权利 · <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">粤ICP备2026130534号-1</a>
</div>
</div>
</footer>
<script src="assets/js/main.js"></script>
</body>
</html>