83 lines
2.0 KiB
Vue
83 lines
2.0 KiB
Vue
<script setup lang="ts">
|
||
import { useClipboard } from '@vueuse/core'
|
||
|
||
const route = useRoute()
|
||
const toast = useToast()
|
||
const { copy, copied } = useClipboard()
|
||
|
||
// SSR 安全：不要直接使用 window，改用 useRequestURL().origin
|
||
const requestURL = useRequestURL()
|
||
const origin = computed(() => requestURL.origin)
|
||
|
||
const mdcLink = computed(() => `${origin.value}${decodeURIComponent(route.path)}`)
|
||
const markdownLink = computed(() => `${origin.value}/raw${decodeURIComponent(route.path)}.md`)
|
||
|
||
const items = [
|
||
{
|
||
label: '复制链接',
|
||
icon: 'lucide-link',
|
||
onSelect() {
|
||
copy(mdcLink.value)
|
||
|
||
toast.add({
|
||
title: '文档链接已复制到剪贴板',
|
||
icon: 'lucide-check-circle',
|
||
color: 'success'
|
||
})
|
||
}
|
||
},
|
||
{
|
||
label: '查看 Markdown',
|
||
icon: 'simple-icons:markdown',
|
||
target: '_blank',
|
||
to: markdownLink.value
|
||
},
|
||
{
|
||
label: '在 ChatGPT 中打开',
|
||
icon: 'simple-icons:openai',
|
||
target: '_blank',
|
||
to: `https://chatgpt.com/?hints=search&q=${encodeURIComponent(`Read ${markdownLink.value} so I can ask questions about it.`)}`
|
||
},
|
||
{
|
||
label: '在 Claude 中打开',
|
||
icon: 'simple-icons:anthropic',
|
||
target: '_blank',
|
||
to: `https://claude.ai/new?q=${encodeURIComponent(`Read ${markdownLink.value} so I can ask questions about it.`)}`
|
||
}
|
||
]
|
||
</script>
|
||
|
||
<template>
|
||
<UButtonGroup size="sm">
|
||
<UButton
|
||
label="复制链接"
|
||
:icon="copied ? 'lucide-copy-check' : 'lucide-copy'"
|
||
color="neutral"
|
||
variant="outline"
|
||
:ui="{
|
||
leadingIcon: [copied ? 'text-primary' : 'text-neutral', 'size-3.5']
|
||
}"
|
||
@click="copy(mdcLink)"
|
||
/>
|
||
|
||
<UDropdownMenu
|
||
size="sm"
|
||
:items="items"
|
||
:content="{
|
||
align: 'end',
|
||
side: 'bottom',
|
||
sideOffset: 8
|
||
}"
|
||
:ui="{
|
||
content: 'w-48'
|
||
}"
|
||
>
|
||
<UButton
|
||
icon="lucide-chevron-down"
|
||
color="neutral"
|
||
variant="outline"
|
||
/>
|
||
</UDropdownMenu>
|
||
</UButtonGroup>
|
||
</template>
|