Private
Public Access
1
0

feat: 添加 XCodeClaw 费用方案页面
All checks were successful
Deploy to Cloudflare Pages / deploy (push) Successful in 42s

新增定价与联系指引页面,包含四档流量包方案(99/199/599/1099),
各方案展示多种任务工作量参考,Token 消耗参考表,定制联系入口。
产品介绍页底部新增费用方案跳转按钮。

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
zwang
2026-03-12 11:08:59 +08:00
parent d6b71fee99
commit 3895681bfd
4 changed files with 376 additions and 0 deletions

View File

@@ -33,6 +33,7 @@ export default defineConfig({
{ text: "产品介绍", link: "/xcodeclaw" }, { text: "产品介绍", link: "/xcodeclaw" },
{ text: "飞书机器人配置", link: "/guide/feishu-bot" }, { text: "飞书机器人配置", link: "/guide/feishu-bot" },
{ text: "新用户上手指引", link: "/guide/trial-guide" }, { text: "新用户上手指引", link: "/guide/trial-guide" },
{ text: "费用方案", link: "/guide/pricing" },
], ],
}, },
], ],

322
docs/guide/pricing.md Normal file
View File

@@ -0,0 +1,322 @@
---
title: 费用方案 - XCodeClaw
outline: false
---
<div class="pricing-page">
<!-- Hero -->
<div class="pricing-hero">
<div class="pricing-hero-inner">
<div class="pricing-badge">XCodeClaw 费用方案</div>
<h1 class="pricing-title">选择适合你的方案</h1>
<p class="pricing-subtitle">Token 流量包模式,选择适合的额度,在有效期内畅享使用。</p>
</div>
</div>
<!-- 定价卡片 -->
<div class="pricing-section pricing-section-alt">
<div class="pricing-inner">
<div class="pricing-slabel">Pricing Plans</div>
<h2 class="pricing-stitle">费用方案一览</h2>
<p class="pricing-sdesc">所有方案均包含 Claude Opus 4.6 满血模型、联网搜索、AI 画图、LaTeX 排版等全部功能。</p>
<div class="pricing-new-user">🎁 新用户福利:注册即赠送联网搜索额度</div>
<div class="pricing-grid">
<div class="pricing-card">
<div class="card-header">
<div class="card-name">入门版</div>
<div class="card-price">¥99</div>
<div class="card-token">2000 万 Token</div>
</div>
<div class="card-body">
<ul>
<li><strong>~20 篇</strong> 综述写作</li>
<li><strong>~16 份</strong> 深度调研报告</li>
<li><strong>~40 次</strong> 数据分析与可视化</li>
<li><strong>~80 篇</strong> 论文润色 / 降 AI 率</li>
<li><strong>~50 篇</strong> 学术全文翻译</li>
<li><strong>~400 次</strong> 日常学术问答</li>
</ul>
<div class="card-note">适合轻度使用、短期项目</div>
</div>
</div>
<div class="pricing-card card-popular">
<div class="card-badge">推荐</div>
<div class="card-header">
<div class="card-name">标准版</div>
<div class="card-price">¥199</div>
<div class="card-token">5000 万 Token</div>
</div>
<div class="card-body">
<ul>
<li><strong>~50 篇</strong> 综述写作</li>
<li><strong>~40 份</strong> 深度调研报告</li>
<li><strong>~100 次</strong> 数据分析与可视化</li>
<li><strong>~200 篇</strong> 论文润色 / 降 AI 率</li>
<li><strong>~125 篇</strong> 学术全文翻译</li>
<li><strong>~1000 次</strong> 日常学术问答</li>
</ul>
<div class="card-note">适合日常科研、学期使用</div>
</div>
</div>
<div class="pricing-card">
<div class="card-header">
<div class="card-name">专业版</div>
<div class="card-price">¥599</div>
<div class="card-token">2 亿 Token</div>
</div>
<div class="card-body">
<ul>
<li><strong>~200 篇</strong> 综述写作</li>
<li><strong>~160 份</strong> 深度调研报告</li>
<li><strong>~400 次</strong> 数据分析与可视化</li>
<li><strong>~800 篇</strong> 论文润色 / 降 AI 率</li>
<li><strong>~500 篇</strong> 学术全文翻译</li>
<li><strong>~4000 次</strong> 日常学术问答</li>
</ul>
<div class="card-note">适合重度科研、课题组使用</div>
</div>
</div>
<div class="pricing-card">
<div class="card-header">
<div class="card-name">旗舰版</div>
<div class="card-price">¥1099</div>
<div class="card-token">4 亿 Token</div>
</div>
<div class="card-body">
<ul>
<li><strong>~400 篇</strong> 综述写作</li>
<li><strong>~320 份</strong> 深度调研报告</li>
<li><strong>~800 次</strong> 数据分析与可视化</li>
<li><strong>~1600 篇</strong> 论文润色 / 降 AI 率</li>
<li><strong>~1000 篇</strong> 学术全文翻译</li>
<li><strong>~8000 次</strong> 日常学术问答</li>
</ul>
<div class="card-note">适合实验室、团队长期使用</div>
</div>
</div>
</div>
<p class="pricing-note">* 以上工作量为单项估算,实际使用中各任务混合消耗 Token。</p>
<div class="pricing-contact-bar">
<span>更多方案可定制</span>
<span class="contact-divider">|</span>
<span>咨询与购买请联系 <a href="mailto:support@xcodecli.com" class="contact-bar-email">support@xcodecli.com</a></span>
</div>
</div>
</div>
<!-- Token 消耗参考 -->
<div id="token-reference" class="pricing-section">
<div class="pricing-inner">
<div class="pricing-slabel">Token Reference</div>
<h2 class="pricing-stitle">各任务 Token 消耗参考</h2>
<p class="pricing-sdesc">不同任务复杂度不同,消耗的 Token 量也不一样。以下为实测估算值。</p>
<table class="pricing-table">
<thead>
<tr><th>任务类型</th><th>约消耗 Token</th><th>说明</th></tr>
</thead>
<tbody>
<tr><td>综述写作</td><td class="token-val">~100 万</td><td>多轮搜索 + 结构化报告 + 引用整理</td></tr>
<tr><td>深度调研报告</td><td class="token-val">~120 万</td><td>多源检索、交叉验证、长篇分析</td></tr>
<tr><td>数据分析与可视化</td><td class="token-val">~50 万</td><td>上传数据、统计分析、生成图表</td></tr>
<tr><td>论文润色 / 降 AI 率</td><td class="token-val">~25 万</td><td>全文修改、消除 AI 写作痕迹</td></tr>
<tr><td>学术全文翻译</td><td class="token-val">~40 万</td><td>整篇论文中英互译、术语统一</td></tr>
<tr><td>日常学术问答</td><td class="token-val">~5 万</td><td>单次问答、概念解释、简短任务</td></tr>
</tbody>
</table>
</div>
</div>
<!-- 定制方案 & 联系 -->
<div id="contact" class="pricing-section pricing-section-dark">
<div class="pricing-inner">
<div class="pricing-slabel pricing-slabel-accent">Custom Plan</div>
<h2 class="pricing-stitle" style="color: #fff;">需要更多?联系定制</h2>
<p class="pricing-sdesc">以上方案不满足需求?我们提供灵活的定制方案,适配团队和机构场景。</p>
<div class="contact-grid">
<div class="contact-card">
<div class="contact-icon">💬</div>
<h3>微信咨询</h3>
<p>添加管理员微信,一对一沟通需求,获取专属报价。</p>
</div>
<div class="contact-card">
<div class="contact-icon">📧</div>
<h3>邮件联系</h3>
<p>发送需求至 <a href="mailto:support@xcodecli.com" class="contact-link">support@xcodecli.com</a>,我们将在 24 小时内回复。</p>
</div>
<div class="contact-card">
<div class="contact-icon">🏢</div>
<h3>团队 / 机构</h3>
<p>课题组、实验室、院系批量采购,享专属折扣与优先支持。</p>
</div>
</div>
</div>
</div>
<!-- CTA -->
<div class="pricing-cta">
<h2>准备好开始了吗?</h2>
<p>查看配置指南,几分钟即可上手使用 XCodeClaw。</p>
<div class="cta-buttons">
<a href="/guide/feishu-bot" class="pricing-cta-btn">配置指南 →</a>
<a href="/xcodeclaw" class="pricing-cta-btn pricing-cta-btn-alt">了解产品 →</a>
</div>
</div>
</div>
<style>
/* 让内容区占满右侧目录的空间 */
.VPDoc.has-aside .content-container { max-width: 100% !important; }
.VPDoc .aside { display: none !important; }
.pricing-page { max-width: 100vw; overflow-x: hidden; }
/* Hero */
.pricing-hero {
background: linear-gradient(135deg, #0f1629 0%, #1a2240 50%, #2B5CE6 100%);
color: #f1f5f9; text-align: center; margin: -24px -24px 0; padding: 60px 24px;
}
.pricing-hero-inner { max-width: 700px; margin: 0 auto; }
.pricing-badge {
display: inline-block; background: rgba(43,92,230,0.2); border: 1px solid rgba(43,92,230,0.4);
border-radius: 20px; padding: 6px 20px; font-size: 0.85em; color: #FDBA74;
margin-bottom: 20px; letter-spacing: 1px;
}
.pricing-title {
font-size: 2.6em !important; font-weight: 800; margin-bottom: 12px;
background: linear-gradient(135deg, #fff 0%, #93c5fd 100%);
-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
border: none !important;
}
.pricing-subtitle { font-size: 1.15em; color: #94a3b8; }
/* Section */
.pricing-section { padding: 60px 24px; }
.pricing-section-alt { background: var(--vp-c-bg-soft); }
.pricing-section-dark { background: #0f1629; color: #f1f5f9; }
.pricing-inner { max-width: 1060px; margin: 0 auto; }
.pricing-slabel {
display: inline-block; font-size: 0.8em; font-weight: 700; letter-spacing: 2px;
text-transform: uppercase; color: #2B5CE6; margin-bottom: 10px;
}
.pricing-slabel-accent { color: #FDBA74; }
.pricing-stitle { font-size: 2em; font-weight: 800; margin-bottom: 16px; line-height: 1.3; border: none !important; }
.pricing-sdesc { font-size: 1.05em; color: var(--vp-c-text-2); margin-bottom: 40px; }
.pricing-section-dark .pricing-sdesc { color: #94a3b8; }
/* New User Tag */
.pricing-new-user {
display: inline-block; margin-bottom: 28px; padding: 8px 20px; border-radius: 8px;
background: rgba(249,115,22,0.1); border: 1px solid rgba(249,115,22,0.25);
color: #ea580c; font-size: 0.9em; font-weight: 600;
}
/* Pricing Cards */
.pricing-grid {
display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 20px;
}
.pricing-card {
position: relative; background: var(--vp-c-bg); border: 1px solid var(--vp-c-divider);
border-radius: 14px; overflow: hidden; transition: box-shadow 0.2s, transform 0.2s;
}
.pricing-card:hover { box-shadow: 0 8px 30px rgba(0,0,0,0.08); transform: translateY(-2px); }
.pricing-card.card-popular { border: 2px solid #2B5CE6; }
.card-badge {
position: absolute; top: 12px; right: -28px; transform: rotate(45deg);
background: linear-gradient(135deg, #2B5CE6, #7c3aed); color: #fff;
font-size: 0.75em; font-weight: 700; padding: 4px 36px; letter-spacing: 1px;
}
.card-header {
text-align: center; padding: 28px 20px 20px;
background: linear-gradient(180deg, var(--vp-c-bg-soft) 0%, var(--vp-c-bg) 100%);
}
.card-name { font-size: 1em; font-weight: 700; color: var(--vp-c-text-2); margin-bottom: 8px; }
.card-price { font-size: 2.4em; font-weight: 800; color: var(--vp-c-text-1); margin-bottom: 4px; }
.card-token {
display: inline-block; font-size: 0.85em; font-weight: 600; color: #2B5CE6;
background: rgba(43,92,230,0.08); padding: 4px 14px; border-radius: 20px;
}
.card-body { padding: 20px; }
.card-body ul { list-style: none; padding: 0; margin: 0; }
.card-body li {
padding: 8px 0; border-bottom: 1px solid var(--vp-c-divider);
font-size: 0.9em; color: var(--vp-c-text-2);
}
.card-body li:last-child { border-bottom: none; }
.card-body li strong { color: var(--vp-c-text-1); }
.card-note {
margin-top: 12px; font-size: 0.82em; color: var(--vp-c-text-3);
text-align: center; font-style: italic;
}
.pricing-note { font-size: 0.85em; color: var(--vp-c-text-3); text-align: center; }
/* Contact Bar */
.pricing-contact-bar {
margin-top: 28px; padding: 18px 28px; border-radius: 12px; text-align: center;
background: linear-gradient(135deg, #2B5CE6, #7c3aed); color: #fff;
font-size: 1.05em; font-weight: 600;
}
.contact-divider { margin: 0 12px; opacity: 0.5; }
.contact-bar-email {
color: #FDBA74 !important; text-decoration: underline !important; font-weight: 700;
}
.contact-bar-email:hover { color: #FDE68A !important; }
/* Token Table */
.pricing-table { width: 100%; border-collapse: collapse; font-size: 0.95em; }
.pricing-table th {
background: #2B5CE6; color: #fff; padding: 14px 20px; text-align: left; font-weight: 600;
}
.pricing-table th:first-child { border-radius: 10px 0 0 0; }
.pricing-table th:last-child { border-radius: 0 10px 0 0; }
.pricing-table td { padding: 12px 20px; border-bottom: 1px solid var(--vp-c-divider); }
.pricing-table tr:last-child td { border-bottom: none; }
.pricing-table tr:nth-child(even) { background: var(--vp-c-bg-soft); }
.token-val { font-weight: 700; color: #2B5CE6; }
/* Contact */
.contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.contact-card {
background: #1a2240; border-radius: 14px; padding: 28px 24px; text-align: center;
}
.contact-icon { font-size: 2em; margin-bottom: 12px; }
.contact-card h3 { font-size: 1.05em; color: #f1f5f9; margin-bottom: 8px; border: none !important; }
.contact-card p { font-size: 0.9em; color: #94a3b8; margin: 0; }
.contact-link { color: #FDBA74 !important; text-decoration: underline !important; }
.contact-link:hover { color: #F97316 !important; }
/* CTA */
.pricing-cta {
text-align: center; padding: 60px 24px;
background: linear-gradient(180deg, var(--vp-c-bg) 0%, var(--vp-c-bg-soft) 100%);
}
.pricing-cta h2 { font-size: 2em; font-weight: 800; margin-bottom: 16px; border: none !important; }
.pricing-cta p { color: var(--vp-c-text-2); max-width: 500px; margin: 0 auto 28px; font-size: 1.05em; }
.cta-buttons { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.pricing-cta-btn {
display: inline-block; background: linear-gradient(135deg, #2B5CE6, #7c3aed);
color: #fff !important; padding: 14px 32px; border-radius: 10px; font-size: 1em;
font-weight: 700; text-decoration: none !important; transition: transform 0.2s, box-shadow 0.2s;
}
.pricing-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(43,92,230,0.3); }
.pricing-cta-btn-alt {
background: transparent; border: 2px solid var(--vp-c-divider); color: var(--vp-c-text-1) !important;
}
.pricing-cta-btn-alt:hover { border-color: #2B5CE6; color: #2B5CE6 !important; box-shadow: none; }
/* Responsive */
@media (max-width: 768px) {
.pricing-title { font-size: 2em !important; }
.pricing-grid { grid-template-columns: 1fr; }
.contact-grid { grid-template-columns: 1fr; }
.pricing-section { padding: 40px 16px; }
.pricing-contact-bar { font-size: 0.9em; padding: 16px 20px; }
.contact-divider { display: none; }
.pricing-contact-bar { display: flex; flex-direction: column; gap: 6px; }
}
@media (min-width: 769px) and (max-width: 1024px) {
.pricing-grid { grid-template-columns: repeat(2, 1fr); }
}
</style>

View File

@@ -197,6 +197,7 @@ title: XCodeClaw - AI 学术助手
<h2>开始使用 XCodeClaw</h2> <h2>开始使用 XCodeClaw</h2>
<p>让 AI 成为你的科研伙伴,从今天开始提升学术生产力。</p> <p>让 AI 成为你的科研伙伴,从今天开始提升学术生产力。</p>
<a href="/guide/feishu-bot" class="xclaw-cta-btn">查看配置指南 →</a> <a href="/guide/feishu-bot" class="xclaw-cta-btn">查看配置指南 →</a>
<a href="/guide/pricing" class="xclaw-cta-btn xclaw-cta-btn-alt">费用方案 →</a>
</div> </div>
</div> </div>
@@ -327,6 +328,11 @@ title: XCodeClaw - AI 学术助手
font-weight: 700; text-decoration: none !important; transition: transform 0.2s, box-shadow 0.2s; font-weight: 700; text-decoration: none !important; transition: transform 0.2s, box-shadow 0.2s;
} }
.xclaw-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(43,92,230,0.3); } .xclaw-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(43,92,230,0.3); }
.xclaw-cta-btn-alt {
background: transparent; border: 2px solid var(--vp-c-divider); color: var(--vp-c-text-1) !important;
margin-left: 12px;
}
.xclaw-cta-btn-alt:hover { border-color: #2B5CE6; color: #2B5CE6 !important; box-shadow: none; }
/* Responsive */ /* Responsive */
@media (max-width: 768px) { @media (max-width: 768px) {

47
projectplan.md Normal file
View File

@@ -0,0 +1,47 @@
# XCodeClaw 费用与联系指引页面
## 任务说明
在 docs 下新增一个 XCodeClaw 的费用定价和联系指引页面。
## 定价方案1刀 = 50万 token页面不体现"刀"
| 方案 | 价格 (¥) | Token 额度 |
|------|----------|-----------|
| 入门版 | 99 | 2000万 token |
| 标准版 | 199 | 5000万 token |
| 专业版 | 599 | 2亿 token |
| 旗舰版 | 1099 | 4亿 token |
### 各任务 token 消耗参考(基于综述 ≈ 100万 token 推算)
| 任务类型 | 约消耗 token | 说明 |
|---------|-------------|------|
| 综述写作 | ~100万 | 基准,含多轮搜索+结构化报告 |
| 深度调研 | ~120万 | 多源检索+分析,略多于综述 |
| 数据分析+可视化 | ~50万 | 上传数据、统计分析、出图 |
| 论文润色/降 AI 率 | ~25万 | 全文修改,消除 AI 痕迹 |
| 学术翻译(全文) | ~40万 | 整篇论文中英互译 |
| 日常学术问答 | ~5万 | 单次问答或简短任务 |
- 更多方案联系定制
- 新用户优惠:赠送搜索
## Todo
- [x] 1. 创建 `docs/guide/pricing.md` 定价页面,沿用 xcodeclaw.md 的视觉风格
- [x] 2. 更新 `docs/.vitepress/config.ts`,在 XCodeClaw 侧边栏添加"费用方案"链接
## Review
### 变更内容
1. **新增 `docs/guide/pricing.md`** — XCodeClaw 费用方案页面
- Hero 区域 + 新用户赠搜索提示
- 4 个定价卡片99/199/599/1099每个展示 6 种任务的参考工作量
- Token 消耗参考表(综述、深度调研、数据分析、论文润色、翻译、问答)
- 定制方案联系区域
- 底部 CTA 跳转配置指南和产品介绍
- 样式复用 xcodeclaw.md 的设计语言(渐变色、卡片、深色区块)
- 响应式适配
2. **修改 `docs/.vitepress/config.ts`**
- 在 XCodeClaw 侧边栏新增 `费用方案` 链接