refactor: 统一剪贴板复制功能到 useClipboard 组合式函数

将各个组件和视图中重复的剪贴板复制逻辑提取到 useClipboard 组合式函数。
增加 showToast 参数支持静默复制，减少代码重复，提高维护性。

frontend/src/composables/useClipboard.ts

@@ -4,11 +4,11 @@ import { log } from '@/utils/logger'
 export function useClipboard() {
   const { success, error: showError } = useToast()
 
-  async function copyToClipboard(text: string): Promise<boolean> {
+  async function copyToClipboard(text: string, showToast = true): Promise<boolean> {
     try {
       if (navigator.clipboard && window.isSecureContext) {
         await navigator.clipboard.writeText(text)
-        success('已复制到剪贴板')
+        if (showToast) success('已复制到剪贴板')
         return true
       }
 
@@ -25,17 +25,17 @@ export function useClipboard() {
       try {
         const successful = document.execCommand('copy')
         if (successful) {
-          success('已复制到剪贴板')
+          if (showToast) success('已复制到剪贴板')
           return true
         }
-        showError('复制失败，请手动复制')
+        if (showToast) showError('复制失败，请手动复制')
         return false
       } finally {
         document.body.removeChild(textArea)
       }
     } catch (err) {
       log.error('复制失败:', err)
-      showError('复制失败，请手动选择文本进行复制')
+      if (showToast) showError('复制失败，请手动选择文本进行复制')
       return false
     }
   }

frontend/src/features/models/components/ModelDetailDrawer.vue

@@ -700,6 +700,7 @@ import {
 } from 'lucide-vue-next'
 import { useEscapeKey } from '@/composables/useEscapeKey'
 import { useToast } from '@/composables/useToast'
+import { useClipboard } from '@/composables/useClipboard'
 import Card from '@/components/ui/card.vue'
 import Badge from '@/components/ui/badge.vue'
 import Button from '@/components/ui/button.vue'
@@ -731,6 +732,7 @@ const emit = defineEmits<{
   'refreshProviders': []
 }>()
 const { success: showSuccess, error: showError } = useToast()
+const { copyToClipboard } = useClipboard()
 
 interface Props {
   model: GlobalModelResponse | null
@@ -763,16 +765,6 @@ function handleClose() {
   }
 }
 
-// 复制到剪贴板
-async function copyToClipboard(text: string) {
-  try {
-    await navigator.clipboard.writeText(text)
-    showSuccess('已复制')
-  } catch {
-    showError('复制失败')
-  }
-}
-
 // 格式化日期
 function formatDate(dateStr: string): string {
   if (!dateStr) return '-'

frontend/src/features/providers/components/ProviderDetailDrawer.vue

@@ -661,6 +661,7 @@ import Button from '@/components/ui/button.vue'
 import Badge from '@/components/ui/badge.vue'
 import Card from '@/components/ui/card.vue'
 import { useToast } from '@/composables/useToast'
+import { useClipboard } from '@/composables/useClipboard'
 import { getProvider, getProviderEndpoints } from '@/api/endpoints'
 import {
   KeyFormDialog,
@@ -706,6 +707,7 @@ const emit = defineEmits<{
 }>()
 
 const { error: showError, success: showSuccess } = useToast()
+const { copyToClipboard } = useClipboard()
 
 const loading = ref(false)
 const provider = ref<any>(null)
@@ -1250,16 +1252,6 @@ function getHealthScoreBarColor(score: number): string {
   return 'bg-red-500 dark:bg-red-400'
 }
 
-// 复制到剪贴板
-async function copyToClipboard(text: string) {
-  try {
-    await navigator.clipboard.writeText(text)
-    showSuccess('已复制到剪贴板')
-  } catch {
-    showError('复制失败', '错误')
-  }
-}
-
 // 加载 Provider 信息
 async function loadProvider() {
   if (!props.providerId) return

frontend/src/features/providers/components/provider-tabs/ModelsTab.vue

@@ -224,6 +224,7 @@ import { Box, Edit, Trash2, Layers, Eye, Wrench, Zap, Brain, Power, Copy, Image,
 import Card from '@/components/ui/card.vue'
 import Button from '@/components/ui/button.vue'
 import { useToast } from '@/composables/useToast'
+import { useClipboard } from '@/composables/useClipboard'
 import { getProviderModels, testModel, type Model } from '@/api/endpoints'
 import { updateModel } from '@/api/endpoints/models'
 import { parseTestModelError } from '@/utils/errorParser'
@@ -239,6 +240,7 @@ const emit = defineEmits<{
 }>()
 
 const { error: showError, success: showSuccess } = useToast()
+const { copyToClipboard } = useClipboard()
 
 // 状态
 const loading = ref(false)
@@ -257,12 +259,7 @@ const sortedModels = computed(() => {
 
 // 复制模型 ID 到剪贴板
 async function copyModelId(modelId: string) {
-  try {
+  await copyToClipboard(modelId)
-    await navigator.clipboard.writeText(modelId)
-    showSuccess('已复制到剪贴板')
-  } catch {
-    showError('复制失败', '错误')
-  }
 }
 
 // 加载模型

frontend/src/features/usage/components/RequestDetailDrawer.vue

@@ -473,6 +473,7 @@
 import { ref, watch, computed } from 'vue'
 import Button from '@/components/ui/button.vue'
 import { useEscapeKey } from '@/composables/useEscapeKey'
+import { useClipboard } from '@/composables/useClipboard'
 import Card from '@/components/ui/card.vue'
 import Badge from '@/components/ui/badge.vue'
 import Separator from '@/components/ui/separator.vue'
@@ -505,6 +506,7 @@ const copiedStates = ref<Record<string, boolean>>({})
 const viewMode = ref<'compare' | 'formatted' | 'raw'>('compare')
 const currentExpandDepth = ref(1)
 const dataSource = ref<'client' | 'provider'>('client')
+const { copyToClipboard } = useClipboard()
 const historicalPricing = ref<{
   input_price: string
   output_price: string
@@ -784,7 +786,7 @@ function copyJsonToClipboard(tabName: string) {
   }
 
   if (data) {
-    navigator.clipboard.writeText(JSON.stringify(data, null, 2))
+    copyToClipboard(JSON.stringify(data, null, 2), false)
     copiedStates.value[tabName] = true
     setTimeout(() => {
       copiedStates.value[tabName] = false

frontend/src/views/admin/ApiKeys.vue

@@ -650,6 +650,7 @@
 import { ref, computed, onMounted } from 'vue'
 import { useToast } from '@/composables/useToast'
 import { useConfirm } from '@/composables/useConfirm'
+import { useClipboard } from '@/composables/useClipboard'
 import { adminApi, type AdminApiKey, type CreateStandaloneApiKeyRequest } from '@/api/admin'
 
 import {
@@ -693,6 +694,7 @@ import { log } from '@/utils/logger'
 
 const { success, error } = useToast()
 const { confirmDanger } = useConfirm()
+const { copyToClipboard } = useClipboard()
 
 const apiKeys = ref<AdminApiKey[]>([])
 const loading = ref(false)
@@ -927,20 +929,14 @@ function selectKey() {
 }
 
 async function copyKey() {
-  try {
+  await copyToClipboard(newKeyValue.value)
-    await navigator.clipboard.writeText(newKeyValue.value)
-    success('API Key 已复制到剪贴板')
-  } catch {
-    error('复制失败，请手动复制')
-  }
 }
 
 async function copyKeyPrefix(apiKey: AdminApiKey) {
   try {
     // 调用后端 API 获取完整密钥
     const response = await adminApi.getFullApiKey(apiKey.id)
-    await navigator.clipboard.writeText(response.key)
+    await copyToClipboard(response.key)
-    success('完整密钥已复制到剪贴板')
   } catch (err) {
     log.error('复制密钥失败:', err)
     error('复制失败，请重试')

frontend/src/views/admin/ModelManagement.vue

@@ -713,6 +713,7 @@ import ProviderModelFormDialog from '@/features/providers/components/ProviderMod
 import type { Model } from '@/api/endpoints'
 import { useToast } from '@/composables/useToast'
 import { useConfirm } from '@/composables/useConfirm'
+import { useClipboard } from '@/composables/useClipboard'
 import { useRowClick } from '@/composables/useRowClick'
 import { parseApiError } from '@/utils/errorParser'
 import {
@@ -743,6 +744,7 @@ import { getProvidersSummary } from '@/api/endpoints/providers'
 import { getAllCapabilities, type CapabilityDefinition } from '@/api/endpoints'
 
 const { success, error: showError } = useToast()
+const { copyToClipboard } = useClipboard()
 
 // 状态
 const loading = ref(false)
@@ -1066,16 +1068,6 @@ function handleRowClick(event: MouseEvent, model: GlobalModelResponse) {
   selectModel(model)
 }
 
-// 复制到剪贴板
-async function copyToClipboard(text: string) {
-  try {
-    await navigator.clipboard.writeText(text)
-    success('已复制')
-  } catch {
-    showError('复制失败')
-  }
-}
-
 async function selectModel(model: GlobalModelResponse) {
   selectedModel.value = model
   detailTab.value = 'basic'

frontend/src/views/admin/Users.vue

@@ -701,6 +701,7 @@ import { ref, computed, onMounted, watch } from 'vue'
 import { useUsersStore } from '@/stores/users'
 import { useToast } from '@/composables/useToast'
 import { useConfirm } from '@/composables/useConfirm'
+import { useClipboard } from '@/composables/useClipboard'
 import { usageApi, type UsageByUser } from '@/api/usage'
 import { adminApi } from '@/api/admin'
 
@@ -748,6 +749,7 @@ import { log } from '@/utils/logger'
 
 const { success, error } = useToast()
 const { confirmDanger, confirmWarning } = useConfirm()
+const { copyToClipboard } = useClipboard()
 const usersStore = useUsersStore()
 
 // 用户表单对话框状态
@@ -1001,12 +1003,7 @@ function selectApiKey() {
 }
 
 async function copyApiKey() {
-  try {
+  await copyToClipboard(newApiKey.value)
-    await navigator.clipboard.writeText(newApiKey.value)
-    success('API Key已复制到剪贴板')
-  } catch {
-    error('复制失败，请手动复制')
-  }
 }
 
 async function closeNewApiKeyDialog() {
@@ -1035,8 +1032,7 @@ async function copyFullKey(apiKey: any) {
   try {
     // 调用后端 API 获取完整密钥
     const response = await adminApi.getFullApiKey(apiKey.id)
-    await navigator.clipboard.writeText(response.key)
+    await copyToClipboard(response.key)
-    success('完整密钥已复制到剪贴板')
   } catch (err: any) {
     log.error('复制密钥失败:', err)
     error(err.response?.data?.error?.message || err.response?.data?.detail || '未知错误', '复制密钥失败')

frontend/src/views/user/ModelCatalog.vue

@@ -342,6 +342,7 @@ import {
   Plus,
 } from 'lucide-vue-next'
 import { useToast } from '@/composables/useToast'
+import { useClipboard } from '@/composables/useClipboard'
 import {
   Card,
   Table,
@@ -370,6 +371,7 @@ import { useRowClick } from '@/composables/useRowClick'
 import { log } from '@/utils/logger'
 
 const { success, error: showError } = useToast()
+const { copyToClipboard } = useClipboard()
 
 // 状态
 const loading = ref(false)
@@ -565,16 +567,6 @@ function hasTieredPricing(model: PublicGlobalModel): boolean {
   return (tiered?.tiers?.length || 0) > 1
 }
 
-async function copyToClipboard(text: string) {
-  try {
-    await navigator.clipboard.writeText(text)
-    success('已复制')
-  } catch (err) {
-    log.error('复制失败:', err)
-    showError('复制失败')
-  }
-}
-
 onMounted(() => {
   refreshData()
 })

frontend/src/views/user/components/UserModelDetailDrawer.vue

@@ -352,6 +352,7 @@ import {
 } from 'lucide-vue-next'
 import { useEscapeKey } from '@/composables/useEscapeKey'
 import { useToast } from '@/composables/useToast'
+import { useClipboard } from '@/composables/useClipboard'
 import Card from '@/components/ui/card.vue'
 import Badge from '@/components/ui/badge.vue'
 import Button from '@/components/ui/button.vue'
@@ -375,6 +376,7 @@ const emit = defineEmits<{
 }>()
 
 const { success: showSuccess, error: showError } = useToast()
+const { copyToClipboard } = useClipboard()
 
 interface Props {
   model: PublicGlobalModel | null
@@ -408,15 +410,6 @@ function handleClose() {
   emit('update:open', false)
 }
 
-async function copyToClipboard(text: string) {
-  try {
-    await navigator.clipboard.writeText(text)
-    showSuccess('已复制')
-  } catch {
-    showError('复制失败')
-  }
-}
-
 function getFirstTierPrice(
   tieredPricing: TieredPricingConfig | undefined | null,
   priceKey: 'input_price_per_1m' | 'output_price_per_1m' | 'cache_creation_price_per_1m' | 'cache_read_price_per_1m'