weizhiqiang/qianshi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: add qianshi site source files

Browse Source 
Sync the local qianshi web project (HTML pages, assets, and config)

Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
qianqiuwanzi
2026-09-15 17:52:05 +08:00
parent 2905f37241
commit fad26b0bd1
45 changed files with 13427 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html.backup.20260704_110219
+465
View File
@@ -0,0 +1,465 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>千视科技 — OpenClaw 生态 · AI智能体 · 内容运营 · 数据服务 · 量化交易</title>
<meta name="description" content="千视科技：OpenClaw安装部署、技能定制、实战训练营；AI智能体定制开发、数字人、OPC一人公司落地；视频制作、自媒体代运营；企业GEO、数据搜索；股票量化交易。">
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>⚡</text></svg>">
<style>
/* ===== Reset & Base ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
--bg: #0a0e1a;
--bg-card: #111827;
--bg-card-hover: #1a2236;
--border: #1e293b;
--text: #e2e8f0;
--text-dim: #94a3b8;
--accent: #6366f1;
--accent-glow: #818cf8;
--green: #10b981;
--orange: #f59e0b;
--red: #ef4444;
}
html { scroll-behavior: smooth; }
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
background: var(--bg);
color: var(--text);
line-height: 1.7;
overflow-x: hidden;
}
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
/* ===== Navigation ===== */
.nav {
position: fixed; top: 0; left: 0; right: 0; z-index: 100;
background: rgba(10,14,26,0.88);
backdrop-filter: blur(14px);
border-bottom: 1px solid var(--border);
}
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.logo { font-size: 1.35rem; font-weight: 800; color: #fff; text-decoration: none; letter-spacing: 1px; }
.nav-links { display: flex; list-style: none; gap: 28px; }
.nav-links a { color: var(--text-dim); text-decoration: none; font-size: 0.93rem; transition: color 0.2s; }
.nav-links a:hover { color: #fff; }
.nav-cta { background: var(--accent); color: #fff; border: none; padding: 9px 22px; border-radius: 8px; font-size: 0.9rem; text-decoration: none; transition: background 0.2s; }
.nav-cta:hover { background: #4f46e5; }
/* Mobile nav */
.menu-toggle { display: none; background: none; border: none; color: #fff; font-size: 1.5rem; cursor: pointer; }
@media (max-width: 768px) {
.nav-links, .nav-cta { display: none; }
.menu-toggle { display: block; }
}
/* ===== Hero ===== */
.hero {
padding: 160px 0 100px;
text-align: center; position: relative; overflow: hidden;
}
.hero::before {
content: ''; position: absolute; top: -200px; left: 50%; transform: translateX(-50%);
width: 700px; height: 700px;
background: radial-gradient(circle, rgba(99,102,241,0.12) 0%, transparent 70%);
pointer-events: none;
}
.hero h1 {
font-size: clamp(2rem, 5vw, 3.2rem);
font-weight: 800; line-height: 1.35; margin-bottom: 18px;
background: linear-gradient(135deg, #fff 0%, #a5b4fc 50%, #6366f1 100%);
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
background-clip: text;
}
.hero p { font-size: 1.1rem; color: var(--text-dim); max-width: 680px; margin: 0 auto 40px; }
.hero-cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.btn { padding: 14px 32px; border-radius: 12px; font-size: 1rem; font-weight: 600; text-decoration: none; transition: all 0.3s; display: inline-block; }
.btn-primary { background: var(--accent); color: #fff; box-shadow: 0 0 40px rgba(99,102,241,0.3); }
.btn-primary:hover { background: #4f46e5; box-shadow: 0 0 60px rgba(99,102,241,0.5); }
.btn-outline { border: 1px solid var(--border); color: #fff; background: transparent; }
.btn-outline:hover { border-color: var(--accent); background: rgba(99,102,241,0.1); }
/* ===== Section ===== */
.section { padding: 90px 0; }
.section-header { text-align: center; margin-bottom: 56px; }
.section-header h2 { font-size: 1.9rem; font-weight: 700; margin-bottom: 10px; }
.section-header p { color: var(--text-dim); font-size: 1rem; }
/* ===== Business Categories ===== */
.biz-category { margin-bottom: 56px; }
.biz-category:last-child { margin-bottom: 0; }
.cat-label {
display: inline-flex; align-items: center; gap: 10px;
font-size: 1.2rem; font-weight: 700; margin-bottom: 20px;
padding-bottom: 10px; border-bottom: 2px solid var(--border);
}
.cat-icon { font-size: 1.5rem; }
.services-grid {
display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px;
}
.service-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 12px; padding: 24px 22px;
transition: all 0.25s; position: relative; overflow: hidden;
}
.service-card:hover {
background: var(--bg-card-hover); border-color: var(--accent);
transform: translateY(-2px);
}
.service-card::before {
content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
background: var(--accent); opacity: 0; transition: opacity 0.25s;
}
.service-card:hover::before { opacity: 1; }
.service-card h4 { font-size: 1rem; margin-bottom: 6px; }
.service-card p { color: var(--text-dim); font-size: 0.85rem; line-height: 1.6; }
/* ===== Stats ===== */
.stats { background: var(--bg-card); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; text-align: center; }
@media (max-width: 768px) { .stats-grid { grid-template-columns: repeat(2, 1fr); } }
.stat-number { font-size: 2.5rem; font-weight: 800; background: linear-gradient(135deg, var(--accent-glow), #c084fc); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.stat-label { color: var(--text-dim); font-size: 0.9rem; margin-top: 8px; }
/* ===== Cases ===== */
.cases-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
@media (max-width: 768px) { .cases-grid { grid-template-columns: 1fr; } }
.case-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 14px; padding: 28px; display: flex; gap: 20px; align-items: flex-start;
transition: border-color 0.25s;
}
.case-card:hover { border-color: var(--accent); }
.case-tag {
font-size: 0.72rem; padding: 3px 10px; border-radius: 12px; display: inline-block;
margin-bottom: 10px; font-weight: 600;
}
.case-tag.video { background: rgba(239,68,68,0.15); color: #f87171; }
.case-tag.agent { background: rgba(99,102,241,0.15); color: #a5b4fc; }
.case-tag.quant { background: rgba(16,185,129,0.15); color: #34d399; }
.case-card h4 { font-size: 1.05rem; margin-bottom: 8px; }
.case-card p { color: var(--text-dim); font-size: 0.88rem; line-height: 1.6; }
/* ===== Courses ===== */
.courses-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .courses-grid { grid-template-columns: 1fr; } }
.course-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 10px; padding: 24px 20px; transition: all 0.25s;
}
.course-card:hover { border-color: var(--accent); transform: translateY(-2px); }
.course-n { font-size: 0.78rem; font-weight: 700; color: var(--accent-glow); margin-bottom: 6px; }
.course-card h4 { font-size: 0.98rem; margin-bottom: 6px; }
.course-card p { color: var(--text-dim); font-size: 0.82rem; line-height: 1.55; }
/* ===== CTA ===== */
.cta-section { text-align: center; padding: 110px 0; position: relative; }
.cta-section::before {
content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
width: 500px; height: 350px;
background: radial-gradient(circle, rgba(99,102,241,0.1) 0%, transparent 70%);
pointer-events: none;
}
.cta-section h2 { font-size: 1.9rem; font-weight: 700; margin-bottom: 14px; }
.cta-section p { color: var(--text-dim); margin-bottom: 30px; font-size: 1rem; }
/* ===== Footer ===== */
.footer { border-top: 1px solid var(--border); padding: 40px 0; color: var(--text-dim); font-size: 0.88rem; }
.footer-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.footer-links { display: flex; gap: 20px; list-style: none; }
.footer-links a { color: var(--text-dim); text-decoration: none; }
.footer-links a:hover { color: #fff; }
/* ===== Animations ===== */
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.anim { animation: fadeUp 0.6s ease-out forwards; opacity: 0; }
.d1 { animation-delay: 0.1s; } .d2 { animation-delay: 0.2s; } .d3 { animation-delay: 0.3s; }
@media (max-width: 640px) {
.hero { padding: 110px 0 50px; }
.section { padding: 50px 0; }
.hero h1 { font-size: 1.65rem; }
}
</style>
</head>
<body>
<nav class="nav">
<div class="container nav-inner">
<a href="#" class="logo">⚡ 千视科技</a>
<ul class="nav-links">
<li><a href="#services">服务</a></li>
<li><a href="#cases">案例</a></li>
<li><a href="#courses">课程</a></li>
<li><a href="#contact">联系</a></li>
</ul>
<a href="#contact" class="nav-cta">免费咨询</a>
<button class="menu-toggle" id="menuBtn">☰</button>
</div>
</nav>
<!-- Hero -->
<section class="hero">
<div class="container">
<h1 class="anim">OpenClaw 生态 × 智能体 × 内容运营<br>为企业装上数字员工引擎</h1>
<p class="anim d1">从 OpenClaw 安装部署到 AI 智能体定制，从自媒体内容代运营到股票量化交易 —— 一站式交付，零门槛上手。</p>
<div class="hero-cta anim d2">
<a href="#services" class="btn btn-primary">查看全部服务</a>
<a href="#courses" class="btn btn-outline">了解实战课程</a>
</div>
</div>
</section>
<!-- Services -->
<section class="section" id="services">
<div class="container">
<div class="section-header">
<h2>核心业务</h2>
<p>覆盖 OpenClaw 全生态 + AI 智能体 + 内容运营 + 数据服务</p>
</div>
<!-- 类别1: OpenClaw 生态 -->
<div class="biz-category">
<div class="cat-label"><span class="cat-icon">🔧</span> OpenClaw 生态服务</div>
<div class="services-grid">
<div class="service-card">
<h4>OpenClaw 安装部署</h4>
<p>Ubuntu/CentOS/群晖多平台部署，SSH + 域名 + SSL 一站式配置，30 分钟交付可用系统。</p>
</div>
<div class="service-card">
<h4>Skill 技能定制</h4>
<p>按行业/场景定制 Skill 插件：内容生产、数据处理、自动回复、飞书/微信集成。</p>
</div>
<div class="service-card">
<h4>实战训练营</h4>
<p>6 门系统课程 + 8 个手把手案例，从零到商业变现，附带完整代码和交付物模板。</p>
</div>
</div>
</div>
<!-- 类别2: AI智能体与企业 -->
<div class="biz-category">
<div class="cat-label"><span class="cat-icon">🤖</span> AI 智能体与企业落地</div>
<div class="services-grid">
<div class="service-card">
<h4>AI 智能体定制开发</h4>
<p>克隆风格、注入知识库、对接企业系统 —— 24h 在线的数字员工，越用越像你。</p>
</div>
<div class="service-card">
<h4>数字人</h4>
<p>真人形象/声音克隆 + AI 大脑，适用于直播带货、品牌代言、虚拟客服等场景。</p>
</div>
<div class="service-card">
<h4>OPC 一人公司落地</h4>
<p>基于 OpenClaw 搭建全自动运营系统：客服 + 内容 + 数据 + 交付，一个人干一个团队的活。</p>
</div>
<div class="service-card">
<h4>企业 GEO</h4>
<p>生成式引擎优化：让 AI 搜索（ChatGPT/豆包/文心）优先推荐你的品牌和产品。</p>
</div>
</div>
</div>
<!-- 类别3: 内容运营 -->
<div class="biz-category">
<div class="cat-label"><span class="cat-icon">🎬</span> 内容与数据服务</div>
<div class="services-grid">
<div class="service-card">
<h4>视频爆款复刻</h4>
<p>热点抓取 → 脚本生成 → TTS 配音 → 视频合成，全流程自动化，日产 3+ 条原创视频。</p>
</div>
<div class="service-card">
<h4>视频制作</h4>
<p>AI 辅助短视频制作：口播/解说/混剪，批量产出，适用于抖音/小红书/视频号。</p>
</div>
<div class="service-card">
<h4>自媒体账号代运营</h4>
<p>多平台内容策划 + AI 生产 + 自动发布 + 数据复盘，替代传统运营团队。</p>
</div>
<div class="service-card">
<h4>数据搜索</h4>
<p>定制化数据采集/清洗/分析/报告，舆情监控、竞品分析、行业调研自动化。</p>
</div>
</div>
</div>
<!-- 类别4: 量化交易 -->
<div class="biz-category">
<div class="cat-label"><span class="cat-icon">💹</span> 量化交易</div>
<div class="services-grid">
<div class="service-card">
<h4>股票量化策略</h4>
<p>多因子筛选 + AI 择时 + Alpaca API 自动下单，纸盘→实盘，全程风控熔断。</p>
</div>
</div>
</div>
</div>
</section>
<!-- Stats -->
<div class="stats section">
<div class="container">
<div class="stats-grid">
<div>
<div class="stat-number">8+</div>
<div class="stat-label">核心业务线</div>
</div>
<div>
<div class="stat-number">6</div>
<div class="stat-label">系统课程</div>
</div>
<div>
<div class="stat-number">500+</div>
<div class="stat-label">AI 视频案例</div>
</div>
<div>
<div class="stat-number">24×7</div>
<div class="stat-label">数字员工在线</div>
</div>
</div>
</div>
</div>
<!-- Cases -->
<section class="section" id="cases">
<div class="container">
<div class="section-header">
<h2>落地案例</h2>
<p>可复现、带交付物的完整方案</p>
</div>
<div class="cases-grid">
<div class="case-card">
<div>
<span class="case-tag video">视频</span>
<h4>视频爆款复刻</h4>
<p>每日自动抓取 AI 领域 TOP10 热搜 → 选题排序 → 生成口播脚本 → TTS 配音 → 字幕合成 → 飞书审核。单人日产 3 条原创视频。</p>
</div>
</div>
<div class="case-card">
<div>
<span class="case-tag agent">智能体</span>
<h4>IP 智能体</h4>
<p>注入品牌知识库 + 产品文档 + 客服话术 → 24h 自动回复小红书/抖音/微信评论 → 智能识别商机推送到飞书群。</p>
</div>
</div>
<div class="case-card">
<div>
<span class="case-tag video">视频</span>
<h4>视频制作</h4>
<p>商品图 + 卖点文案 → AI 生成 15 秒带货视频 → 自动添加 BGM + 字幕 + 片尾。日产 20+ 条，覆盖矩阵账号。</p>
</div>
</div>
<div class="case-card">
<div>
<span class="case-tag quant">量化</span>
<h4>股票量化</h4>
<p>Alpaca API 实时接入 → 价值+动量+质量三因子筛选 → AI 择时打分 → 半自动实盘交易，全程风控熔断。</p>
</div>
</div>
</div>
</div>
</section>
<!-- Courses -->
<section class="section" id="courses">
<div class="container">
<div class="section-header">
<h2>OpenClaw 六门实战课</h2>
<p>从入门到商业变现，三阶段体系化学习</p>
</div>
<div class="courses-grid">
<div class="course-card">
<div class="course-n">01</div>
<h4>入门：从 0 到 1 拥有 AI 助手</h4>
<p>认知架构 → 安装部署 → 基础调教。4 步搭建第一个数字员工。</p>
</div>
<div class="course-card">
<div class="course-n">02</div>
<h4>实战：Skill 生态与自动化</h4>
<p>6 个必装 Skill + 搜索增强 + 内容生产 + 定时飞书推送。</p>
</div>
<div class="course-card">
<div class="course-n">03</div>
<h4>进阶：从用户到专家</h4>
<p>五模块架构 + 运维排错 + 四层记忆 + 多 Agent 协作。</p>
</div>
<div class="course-card">
<div class="course-n">04</div>
<h4>场景（上）：个人效率</h4>
<p>邮箱助手 + 早间简报 + 抖音视频 + 自定义 Skill 开发。</p>
</div>
<div class="course-card">
<div class="course-n">05</div>
<h4>场景（下）：企业级</h4>
<p>一人公司 + 安全加固 + CI/CD + Heartbeat 主动巡检。</p>
</div>
<div class="course-card">
<div class="course-n">06</div>
<h4>商业：变现与集成</h4>
<p>定价框架 + MCP 协议 + 交易机器人 + 附录速查手册。</p>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="cta-section" id="contact">
<div class="container">
<h2>准备好拥有你的数字员工了吗？</h2>
<p>告诉我们你的需求，帮你落地第一个 AI 自动化场景</p>
<div style="display:flex;gap:14px;justify-content:center;flex-wrap:wrap;">
<a href="https://work.weixin.qq.com/" class="btn btn-primary" target="_blank">💬 企业微信咨询</a>
<a href="https://feishu.cn/" class="btn btn-outline" target="_blank">🚀 飞书联系</a>
</div>
</div>
</section>
<footer class="footer">
<div class="container footer-inner">
<div>© 2026 千视科技 · 让每个人拥有数字员工 &nbsp;|&nbsp; <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener" style="color:inherit;text-decoration:none;">粤ICP备2026089876号-1</a></div>
<ul class="footer-links">
<li><a href="#services">服务</a></li>
<li><a href="#cases">案例</a></li>
<li><a href="#courses">课程</a></li>
<li><a href="#contact">联系</a></li>
</ul>
</div>
</footer>
<script>
var menuBtn = document.getElementById('menuBtn');
menuBtn.addEventListener('click', function(){
var nav = document.querySelector('.nav-links');
var isOpen = nav.style.display === 'flex';
nav.style.display = isOpen ? 'none' : 'flex';
if (!isOpen) {
nav.style.flexDirection = 'column';
nav.style.position = 'absolute'; nav.style.top = '64px'; nav.style.left = '0'; nav.style.right = '0';
nav.style.background = 'rgba(10,14,26,0.98)'; nav.style.padding = '20px 24px';
nav.style.borderBottom = '1px solid var(--border)';
}
this.textContent = isOpen ? '☰' : '✕';
});
document.querySelectorAll('a[href^="#"]').forEach(function(a){
a.addEventListener('click', function(e){
e.preventDefault();
var t = document.querySelector(this.getAttribute('href'));
if (t) t.scrollIntoView({behavior:'smooth'});
var nav = document.querySelector('.nav-links');
if (window.innerWidth <= 768) { nav.style.display = 'none'; menuBtn.textContent = '☰'; }
});
});
</script>
</body>
</html>