refactor(frontend): modularize i18n architecture

This commit is contained in:
elky
2026-06-30 17:01:39 +08:00
parent bf29129a4b
commit 9f138d09e6
118 changed files with 11940 additions and 5368 deletions
@@ -23,7 +23,7 @@
:variant="provider.is_active ? 'success' : 'secondary'"
class="text-xs shrink-0"
>
{{ provider.is_active ? '活跃' : '停用' }}
{{ legacyT(provider.is_active ? '活跃' : '停用') }}
</Badge>
</div>
<!-- 内联编辑备注 (移动端) -->
@@ -37,19 +37,19 @@
v-model="localDescriptionValue"
v-auto-focus
class="flex-1 min-w-0 text-xs px-1.5 py-0.5 rounded border border-border bg-background text-foreground focus:outline-none focus:ring-1 focus:ring-primary/50"
placeholder="输入备注..."
:placeholder="legacyT('输入备注...')"
@keydown="handleDescriptionKeydown"
>
<button
class="shrink-0 p-0.5 rounded hover:bg-muted text-primary"
title="保存"
:title="legacyT('保存')"
@click="handleSave"
>
<Check class="w-3.5 h-3.5" />
</button>
<button
class="shrink-0 p-0.5 rounded hover:bg-muted text-muted-foreground"
title="取消"
:title="legacyT('取消')"
@click="handleCancel"
>
<X class="w-3.5 h-3.5" />
@@ -65,7 +65,7 @@
v-else
class="text-xs text-muted-foreground cursor-pointer hover:text-foreground/70 transition-colors"
@click="handleStartEdit"
>添加备注</span>
>{{ legacyT('添加备注') }}</span>
</div>
<div
class="flex items-center gap-0.5 shrink-0"
@@ -75,7 +75,7 @@
variant="ghost"
size="icon"
class="h-7 w-7"
title="查看详情"
:title="legacyT('查看详情')"
@click="$emit('viewDetail', provider.id)"
>
<Eye class="h-3.5 w-3.5" />
@@ -84,7 +84,7 @@
variant="ghost"
size="icon"
class="h-7 w-7"
title="编辑"
:title="legacyT('编辑')"
@click="$emit('editProvider', provider)"
>
<Edit class="h-3.5 w-3.5" />
@@ -93,7 +93,7 @@
variant="ghost"
size="icon"
class="h-7 w-7"
title="扩展操作配置"
:title="legacyT('扩展操作配置')"
@click="$emit('openOpsConfig', provider)"
>
<KeyRound class="h-3.5 w-3.5" />
@@ -131,31 +131,31 @@
class="text-muted-foreground flex items-center gap-1"
>
<Loader2 class="h-3 w-3 animate-spin" />
加载中...
{{ legacyT('加载中...') }}
</span>
<!-- 余额(从上游 API 查询) -->
<span
v-else-if="provider.ops_configured && getProviderBalance(provider.id)"
class="text-muted-foreground"
>
余额 <span class="font-semibold text-foreground/90">{{ formatBalanceDisplay(getProviderBalance(provider.id)) }}</span>
{{ legacyT('余额') }} <span class="font-semibold text-foreground/90">{{ formatBalanceDisplay(getProviderBalance(provider.id)) }}</span>
<!-- Cookie 失效警告 -->
<span
v-if="getProviderCookieExpired(provider.id)"
class="ml-1 text-amber-600 dark:text-amber-500"
:title="getProviderCookieExpired(provider.id)?.message"
>签到 Cookie 已失效</span>
>{{ legacyT('签到 Cookie 已失效') }}</span>
<!-- 签到状态显示 -->
<span
v-else-if="getProviderCheckin(provider.id) && getProviderCheckin(provider.id)?.success !== false"
class="ml-1 text-muted-foreground"
:title="getProviderCheckin(provider.id)?.message"
>已签到</span>
>{{ legacyT('已签到') }}</span>
<span
v-else-if="getProviderCheckin(provider.id)?.success === false"
class="ml-1 text-destructive/70"
:title="getProviderCheckin(provider.id)?.message"
>签到失败</span>
>{{ legacyT('签到失败') }}</span>
</span>
<!-- 余额查询失败时显示错误 -->
<span
@@ -170,19 +170,19 @@
v-else-if="provider.billing_type === 'monthly_quota'"
class="text-muted-foreground"
>
配额 <span
{{ legacyT('配额') }} <span
class="font-semibold"
:class="getQuotaUsedColorClass(provider)"
>${{ (provider.monthly_used_usd ?? 0).toFixed(2) }}</span>/<span class="font-medium">${{ (provider.monthly_quota_usd ?? 0).toFixed(2) }}</span>
</span>
<span class="text-muted-foreground">
端点 {{ provider.active_endpoints }}/{{ provider.total_endpoints }}
{{ legacyT('端点') }} {{ provider.active_endpoints }}/{{ provider.total_endpoints }}
</span>
<span class="text-muted-foreground">
{{ getCredentialLabel(provider) }} {{ provider.active_keys }}/{{ provider.total_keys }}
</span>
<span class="text-muted-foreground">
模型 {{ provider.active_models }}/{{ provider.total_models }}
{{ legacyT('模型') }} {{ provider.active_models }}/{{ provider.total_models }}
</span>
</div>
@@ -195,7 +195,7 @@
v-for="endpoint in sortEndpoints(provider.endpoint_health_details)"
:key="endpoint.api_format"
class="flex flex-col gap-1.5"
:title="getEndpointTooltip(endpoint)"
:title="getEndpointTooltip(endpoint, locale)"
>
<!-- 上排:缩写 + 百分比 -->
<div class="flex items-center justify-between text-[10px] leading-none">
@@ -240,6 +240,7 @@ import { type ProviderWithEndpointsSummary, formatApiFormatShort } from '@/api/e
import { formatBillingType } from '@/utils/format'
import { sortEndpoints, isEndpointAvailable, getEndpointDotColor, getEndpointTooltip } from '@/features/providers/composables/useEndpointStatus'
import { isKeyManagedProviderType } from '../utils/providerTypeUtils'
import { useI18n } from '@/i18n'
const props = defineProps<{
provider: ProviderWithEndpointsSummary
@@ -270,6 +271,7 @@ const vAutoFocus = {
}
const localDescriptionValue = ref('')
const { legacyT, locale } = useI18n()
watch(
() => props.editingDescriptionId,
@@ -304,7 +306,7 @@ function handleDescriptionKeydown(event: KeyboardEvent) {
}
}
function getCredentialLabel(provider: ProviderWithEndpointsSummary): '账号' | '密钥' {
return isKeyManagedProviderType(provider.provider_type) ? '密钥' : '账号'
function getCredentialLabel(provider: ProviderWithEndpointsSummary): string {
return legacyT(isKeyManagedProviderType(provider.provider_type) ? '密钥' : '账号')
}
</script>