Skip to content

Commit 3313b4c

Browse files
committed
copy prompt
1 parent f317735 commit 3313b4c

File tree

4 files changed

+227
-1
lines changed

4 files changed

+227
-1
lines changed
Lines changed: 214 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,214 @@
1+
<script setup lang="ts">
2+
import { ref, computed } from 'vue'
3+
import { useData } from 'vitepress'
4+
5+
const { lang, page } = useData()
6+
const question = ref('')
7+
const isSubmitting = ref(false)
8+
9+
// 检测中文页面:通过 lang 值或路径判断
10+
const isZh = computed(() => {
11+
const langValue = lang.value
12+
const path = page.value?.relativePath || page.value?.filePath || ''
13+
const route = page.value?.route || ''
14+
15+
// 检查 lang 值(可能是 'zh-Hans', 'zh-CN', 'zh' 等)
16+
if (langValue && (langValue.includes('zh') || langValue.includes('ZH'))) {
17+
return true
18+
}
19+
20+
// 检查路径是否包含 /zh/
21+
if (path.includes('/zh/') || route.includes('/zh/')) {
22+
return true
23+
}
24+
25+
return false
26+
})
27+
28+
const texts = computed(() => {
29+
if (isZh.value) {
30+
return {
31+
title: '快速提问',
32+
description: '输入您的问题,复制提示词后可在任何 AI 助手(如 ChatGPT、Claude、Cursor、GitHub Copilot 等)中使用',
33+
placeholder: '例如:如何配置一个使用 C++20 模块的目标?',
34+
button: '复制提示词',
35+
submitting: '复制中...',
36+
hint: '提示:按',
37+
hintKey: 'Ctrl/Cmd + Enter',
38+
hintSuffix: '快速复制',
39+
alertEmpty: '请输入您的问题',
40+
copySuccess: '提示词已复制到剪贴板!您可以在任何 AI 助手中粘贴使用。',
41+
copyFailed: '复制失败,请手动复制',
42+
promptTemplate: `请参考 https://xmake.io/llms-full.txt 了解 xmake 的完整 API 和功能。
43+
44+
我的问题:
45+
`
46+
}
47+
} else {
48+
return {
49+
title: 'Quick Question',
50+
description: 'Enter your question, copy the prompt and use it in any AI assistant (such as ChatGPT, Claude, Cursor, GitHub Copilot, etc.)',
51+
placeholder: 'For example: How do I configure a target that uses C++20 modules?',
52+
button: 'Copy Prompt',
53+
submitting: 'Copying...',
54+
hint: 'Tip: Press',
55+
hintKey: 'Ctrl/Cmd + Enter',
56+
hintSuffix: 'to copy quickly',
57+
alertEmpty: 'Please enter your question',
58+
copySuccess: 'Prompt copied to clipboard! You can paste it in any AI assistant.',
59+
copyFailed: 'Copy failed, please copy manually',
60+
promptTemplate: `Please refer to https://xmake.io/llms-full.txt to understand xmake's complete API and features.
61+
62+
My question:
63+
`
64+
}
65+
}
66+
})
67+
68+
function copyPrompt() {
69+
if (!question.value.trim()) {
70+
alert(texts.value.alertEmpty)
71+
return
72+
}
73+
74+
isSubmitting.value = true
75+
76+
const fullPrompt = texts.value.promptTemplate + question.value.trim()
77+
78+
navigator.clipboard.writeText(fullPrompt).then(() => {
79+
alert(texts.value.copySuccess)
80+
isSubmitting.value = false
81+
}).catch(() => {
82+
alert(texts.value.copyFailed)
83+
isSubmitting.value = false
84+
})
85+
}
86+
87+
function handleKeyPress(event: KeyboardEvent) {
88+
if (event.key === 'Enter' && (event.ctrlKey || event.metaKey)) {
89+
event.preventDefault()
90+
copyPrompt()
91+
}
92+
}
93+
</script>
94+
95+
<template>
96+
<div class="ai-assistant">
97+
<div class="ai-assistant-header">
98+
<h3>{{ texts.title }}</h3>
99+
<p>{{ texts.description }}</p>
100+
</div>
101+
<div class="ai-assistant-form">
102+
<textarea
103+
v-model="question"
104+
class="ai-assistant-input"
105+
:placeholder="texts.placeholder"
106+
rows="4"
107+
@keydown="handleKeyPress"
108+
></textarea>
109+
<button
110+
class="ai-assistant-button"
111+
:disabled="isSubmitting || !question.trim()"
112+
@click="copyPrompt"
113+
>
114+
{{ isSubmitting ? texts.submitting : texts.button }}
115+
</button>
116+
<p class="ai-assistant-hint">
117+
{{ texts.hint }} <kbd>{{ texts.hintKey }}</kbd> {{ texts.hintSuffix }}
118+
</p>
119+
</div>
120+
</div>
121+
</template>
122+
123+
<style scoped>
124+
.ai-assistant {
125+
margin: 2rem 0;
126+
padding: 1.5rem;
127+
border: 1px solid var(--vp-c-divider);
128+
border-radius: 8px;
129+
background: var(--vp-c-bg-soft);
130+
}
131+
132+
.ai-assistant-header h3 {
133+
margin: 0 0 0.5rem 0;
134+
font-size: 1.25rem;
135+
font-weight: 600;
136+
color: var(--vp-c-text-1);
137+
}
138+
139+
.ai-assistant-header p {
140+
margin: 0 0 1rem 0;
141+
font-size: 0.9rem;
142+
color: var(--vp-c-text-2);
143+
}
144+
145+
.ai-assistant-form {
146+
display: flex;
147+
flex-direction: column;
148+
gap: 0.75rem;
149+
}
150+
151+
.ai-assistant-input {
152+
width: 100%;
153+
padding: 0.75rem;
154+
font-size: 0.95rem;
155+
font-family: inherit;
156+
line-height: 1.5;
157+
border: 1px solid var(--vp-c-divider);
158+
border-radius: 6px;
159+
background: var(--vp-c-bg);
160+
color: var(--vp-c-text-1);
161+
resize: vertical;
162+
transition: border-color 0.2s;
163+
}
164+
165+
.ai-assistant-input:focus {
166+
outline: none;
167+
border-color: var(--vp-c-brand);
168+
box-shadow: 0 0 0 3px var(--vp-c-brand-soft);
169+
}
170+
171+
.ai-assistant-button {
172+
padding: 0.75rem 1.5rem;
173+
font-size: 0.95rem;
174+
font-weight: 500;
175+
color: var(--vp-c-bg);
176+
background: var(--vp-c-brand);
177+
border: none;
178+
border-radius: 6px;
179+
cursor: pointer;
180+
transition: background-color 0.2s, transform 0.1s;
181+
align-self: flex-start;
182+
}
183+
184+
.ai-assistant-button:hover:not(:disabled) {
185+
background: var(--vp-c-brand-dark);
186+
transform: translateY(-1px);
187+
}
188+
189+
.ai-assistant-button:active:not(:disabled) {
190+
transform: translateY(0);
191+
}
192+
193+
.ai-assistant-button:disabled {
194+
opacity: 0.6;
195+
cursor: not-allowed;
196+
}
197+
198+
.ai-assistant-hint {
199+
margin: 0;
200+
font-size: 0.85rem;
201+
color: var(--vp-c-text-2);
202+
}
203+
204+
.ai-assistant-hint kbd {
205+
padding: 0.2rem 0.4rem;
206+
font-size: 0.8rem;
207+
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
208+
background: var(--vp-c-bg-alt);
209+
border: 1px solid var(--vp-c-divider);
210+
border-radius: 3px;
211+
box-shadow: 0 1px 0 var(--vp-c-divider);
212+
}
213+
</style>
214+

docs/.vitepress/theme/index.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import Theme from 'vitepress/theme'
22
import { h } from 'vue'
33
import VPDoc from './components/VPDoc.vue'
4+
import AIAssistant from './components/AIAssistant.vue'
45
import './styles.css'
56
import 'virtual:group-icons.css'
67

@@ -27,7 +28,10 @@ export default {
2728
'doc-content-before': () => h(VPDoc)
2829
})
2930
},
30-
enhanceApp({ router }) {
31+
enhanceApp({ app, router }) {
32+
// Register global components
33+
app.component('AIAssistant', AIAssistant)
34+
3135
router.onBeforeRouteChange = (to) => {
3236
const u = new URL(to, 'https://xmake.io')
3337
if (u.pathname === '/') {

docs/guide/best-practices/ai-qa-optimization.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
# AI Q&A Optimization {#ai-qa-optimization}
22

3+
<ClientOnly>
4+
<AIAssistant />
5+
</ClientOnly>
6+
37
When asking questions about xmake to AI assistants (such as ChatGPT, Claude, Cursor, etc.), using some techniques can help AI better understand the context and provide more accurate, higher-quality answers.
48

59
## Provide Reference Documentation Links

docs/zh/guide/best-practices/ai-qa-optimization.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
# AI 问答优化 {#ai-qa-optimization}
22

3+
<ClientOnly>
4+
<AIAssistant />
5+
</ClientOnly>
6+
37
在使用 AI 助手(如 ChatGPT、Claude、Cursor 等)提问关于 xmake 的问题时,通过一些技巧可以帮助 AI 更好地理解上下文,提供更准确、更高质量的回答。
48

59
## 提供参考文档链接

0 commit comments

Comments
 (0)