From 4cbe0c38f738fbfc367bf7938fc042a9ffe2f5ba Mon Sep 17 00:00:00 2001 From: fawney19 Date: Fri, 12 Dec 2025 20:22:03 +0800 Subject: [PATCH] =?UTF-8?q?refactor(frontend):=20=E4=BC=98=E5=8C=96=20Usag?= =?UTF-8?q?e=20=E5=8A=9F=E8=83=BD=E6=A8=A1=E5=9D=97=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 改进 HorizontalRequestTimeline, IntervalTimelineCard, RequestDetailDrawer 等组件 - 优化表格展示组件 --- .../components/HorizontalRequestTimeline.vue | 21 ++----------------- .../usage/components/IntervalTimelineCard.vue | 3 ++- .../usage/components/RequestDetailDrawer.vue | 3 ++- .../usage/components/UsageApiFormatTable.vue | 1 - .../usage/components/UsageModelTable.vue | 1 - .../usage/components/UsageProviderTable.vue | 1 - 6 files changed, 6 insertions(+), 24 deletions(-) diff --git a/frontend/src/features/usage/components/HorizontalRequestTimeline.vue b/frontend/src/features/usage/components/HorizontalRequestTimeline.vue index eaa0987..56310a3 100644 --- a/frontend/src/features/usage/components/HorizontalRequestTimeline.vue +++ b/frontend/src/features/usage/components/HorizontalRequestTimeline.vue @@ -310,6 +310,7 @@ import Skeleton from '@/components/ui/skeleton.vue' import Separator from '@/components/ui/separator.vue' import { ChevronLeft, ChevronRight, ExternalLink } from 'lucide-vue-next' import { requestTraceApi, type RequestTrace, type CandidateRecord } from '@/api/requestTrace' +import { log } from '@/utils/logger' // 节点组类型 interface NodeGroup { @@ -552,11 +553,6 @@ const isCapabilityUsed = (cap: string): boolean => { return activeCapabilities.value.includes(cap) } -// 检查某个能力是否被 Key 支持（保留以备后用） -const _isCapabilitySupported = (cap: string): boolean => { - return keyCapabilities.value.includes(cap) -} - // 格式化能力标签显示 const formatCapabilityLabel = (cap: string): string => { const labels: Record = { @@ -624,7 +620,7 @@ const loadTrace = async () => { trace.value = await requestTraceApi.getRequestTrace(props.requestId) } catch (err: any) { error.value = err.response?.data?.detail || err.message || '加载失败' - console.error('加载请求追踪失败:', err) + log.error('加载请求追踪失败:', err) } finally { loading.value = false } @@ -715,19 +711,6 @@ const getStatusLabel = (status: string) => { return labels[status] || status } -// 获取状态徽章样式（保留以备后用） -const _getStatusBadgeVariant = (status: string): string => { - const variants: Record = { - available: 'outline', - pending: 'secondary', - streaming: 'secondary', - success: 'success', - failed: 'destructive', - skipped: 'outline' - } - return variants[status] || 'default' -} - // 获取状态颜色类 const getStatusColorClass = (status: string) => { const classes: Record = { diff --git a/frontend/src/features/usage/components/IntervalTimelineCard.vue b/frontend/src/features/usage/components/IntervalTimelineCard.vue index 8cd806b..5562904 100644 --- a/frontend/src/features/usage/components/IntervalTimelineCard.vue +++ b/frontend/src/features/usage/components/IntervalTimelineCard.vue @@ -60,6 +60,7 @@ import ScatterChart from '@/components/charts/ScatterChart.vue' import { cacheAnalysisApi, type IntervalTimelineResponse } from '@/api/cache' import { meApi } from '@/api/me' import type { ChartData, ChartOptions } from 'chart.js' +import { log } from '@/utils/logger' const props = withDefaults(defineProps<{ title: string @@ -294,7 +295,7 @@ async function loadData() { }) } } catch (error) { - console.error('加载请求间隔时间线失败:', error) + log.error('加载请求间隔时间线失败:', error) timelineData.value = null } finally { loading.value = false diff --git a/frontend/src/features/usage/components/RequestDetailDrawer.vue b/frontend/src/features/usage/components/RequestDetailDrawer.vue index 4c2383b..23f891a 100644 --- a/frontend/src/features/usage/components/RequestDetailDrawer.vue +++ b/frontend/src/features/usage/components/RequestDetailDrawer.vue @@ -480,6 +480,7 @@ import Tabs from '@/components/ui/tabs.vue' import TabsContent from '@/components/ui/tabs-content.vue' import { Copy, Check, Maximize2, Minimize2, Columns2, RefreshCw, X, Monitor, Server } from 'lucide-vue-next' import { dashboardApi, type RequestDetail } from '@/api/dashboard' +import { log } from '@/utils/logger' // 子组件 import RequestHeadersContent from './RequestDetailDrawer/RequestHeadersContent.vue' @@ -672,7 +673,7 @@ async function loadDetail(id: string) { } } } catch (err) { - console.error('Failed to load request detail:', err) + log.error('Failed to load request detail:', err) error.value = '加载请求详情失败' } finally { loading.value = false diff --git a/frontend/src/features/usage/components/UsageApiFormatTable.vue b/frontend/src/features/usage/components/UsageApiFormatTable.vue index e8237ba..1c40e0b 100644 --- a/frontend/src/features/usage/components/UsageApiFormatTable.vue +++ b/frontend/src/features/usage/components/UsageApiFormatTable.vue @@ -69,7 +69,6 @@