@@ -201,26 +255,148 @@ export function SkillDetail({ skill }: SkillDetailProps) {
-
-
-
- AI 加载提示词
-
-
-
-
+
+
+
+
+ 方式 A · 下载 Skill 安装包
+
+ 推荐
+
+
+ {skillInstallPackage.zipDescription}
+
+
+
+ {skillInstallPackage.zipFileName}
+
+
+ 下载安装包
+
+
+
+
+
+
+
+ 方式 B · 复制 AI 加载链接
+
+
+
+ {skillInstallPackage.loadLinkHint}
+
+
+
+
+
+ AI 加载链接
+
+
+
+
+
+
+ {loadLink}
+
+
+
+
+
+
+
+ 方式 C · 兜底：复制 SKILL.md 全文
+
+
+
+ {skillInstallPackage.skillMdFallbackHint}
+
+
+
+
+
+ 完整 SKILL.md 全文（{skillInstallPackage.skillMdSizeLabel} · 含 API
+ 对接规则与接口清单）
+
+
+
+
+
+
+ {skillMdOpen ? (
+
+
+ {skillMdLoading
+ ? "加载中…"
+ : skillMd || "SKILL.md 暂时无法加载，请稍后重试或直接下载安装包。"}
+
+
+ ) : null}
+
+
+
+
+
+
+ 使用本 SKILL
+
+
+
+
+
+ 方式 A · 自然语言对话
+
+
+
+ AI 加载本 SKILL 后，像平时聊天一样说出你的需求，AI 会自动识别并调用本
+ SKILL：
+
+
+ {usageExample}
+
+
+
+
+
+
+ 方式 B · 精准命令调用（专业用户）
+
+
+
+ 熟悉本 SKILL 后可直接用 slash 命令精准触发，节省 token 与等待时间：
+
+
-
- {skill.detail.installPrompt}
-
diff --git a/src/content/skill-install-package.ts b/src/content/skill-install-package.ts
new file mode 100644
index 0000000..cf387a0
--- /dev/null
+++ b/src/content/skill-install-package.ts
@@ -0,0 +1,35 @@
+import { absoluteUrl } from "@/lib/site-url";
+
+export const skillInstallPackage = {
+ zipHref: "/download/hydata-skill.zip",
+ zipFileName: "hydata-skill.zip",
+ skillMdPath: "/download/hydata-skill/SKILL.md",
+ skillMdSizeLabel: "14 KB",
+ zipDescription:
+ "包含 SKILL.md、Python 客户端（haiyu_client.py）与测试脚本。解压后放入 Cursor / Claude Code / 小龙虾 等工具的 skills 目录即可。",
+ loadLinkHint:
+ "兼容 Cursor / Claude Code / 小龙虾 / OpenClaw 等主流 AI 应用。复制后粘贴到 AI 对话框即可。",
+ skillMdFallbackHint:
+ "适用于不会主动 fetch URL 的 AI 工具（如 CherryStudio）。",
+ guideHref: "/docs/getting-started",
+ guideLabel: "查看接入指南 →",
+} as const;
+
+export function buildSkillLoadLink(title: string): string {
+ return `请加载海宇数科 SKILL（${title}）：${absoluteUrl(skillInstallPackage.skillMdPath)}`;
+}
+
+export function buildNaturalLanguageExample(
+ skillId: string,
+ title: string
+): string {
+ if (skillId === "kyb-verification") {
+ return "「请帮我对 [公司名称] 做一份完整 KYB 核验报告，重点看主体真实性、股东结构、最近 3 年的司法风险」";
+ }
+ return `「请使用 ${title}，对 [公司名称] 做一次完整尽调并输出结构化报告」`;
+}
+
+export function buildSlashCommand(slug: string): string {
+ const cmd = slug.replace(/^\//, "");
+ return `/${cmd} [公司名称]`;
+}
diff --git a/src/styles/components.css b/src/styles/components.css
index 52921d6..bba93ac 100644
--- a/src/styles/components.css
+++ b/src/styles/components.css
@@ -2292,6 +2292,78 @@
margin: 0;
}
+ .skill-install__guide-link {
+ color: var(--color-accent-ink);
+ text-decoration: none;
+ font-weight: 500;
+ transition: opacity 0.2s ease;
+ }
+
+ .skill-install__guide-link:hover {
+ opacity: 0.85;
+ text-decoration: underline;
+ }
+
+ .skill-install__method {
+ display: flex;
+ flex-direction: column;
+ gap: var(--spacing-md);
+ padding: var(--spacing-lg);
+ border: 1px solid var(--color-hairline);
+ border-radius: var(--radius-md);
+ background-color: var(--color-canvas);
+ }
+
+ .skill-install__method-head {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+ gap: var(--spacing-sm);
+ }
+
+ .skill-install__method-title {
+ margin: 0;
+ }
+
+ .skill-install__badge {
+ display: inline-flex;
+ align-items: center;
+ padding: 2px 8px;
+ border-radius: var(--radius-full);
+ font-size: 11px;
+ font-weight: 600;
+ line-height: 1.4;
+ color: var(--color-accent-ink);
+ background-color: var(--color-accent-wash);
+ border: 1px solid color-mix(in srgb, var(--color-accent-ink) 18%, transparent);
+ }
+
+ .skill-install__download {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: var(--spacing-md);
+ flex-wrap: wrap;
+ padding: var(--spacing-md);
+ border: 1px solid var(--color-hairline);
+ border-radius: var(--radius-sm);
+ background-color: var(--color-canvas-muted);
+ }
+
+ .skill-install__download-name {
+ font-family: var(--font-mono-caps);
+ letter-spacing: 0.04em;
+ }
+
+ .skill-install__quote {
+ margin: 0;
+ padding: var(--spacing-md) var(--spacing-lg);
+ border-left: 3px solid var(--color-accent-ink);
+ background-color: var(--color-canvas-muted);
+ border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
+ line-height: 1.65;
+ }
+
.skill-code-block__pre--text {
white-space: pre-wrap;
word-break: break-word;