feat(frontend): 控制台 next-intl 中英双语

接入无 URL 前缀的 zh-CN/en,顶栏与外观设置可切换语言;选择写入 cookie 后刷新生效。
This commit is contained in:
ryan
2026-08-16 16:49:16 +08:00
parent 64fbaa7ef1
commit 5a8722ff07
219 changed files with 21437 additions and 5212 deletions
@@ -1,6 +1,7 @@
'use client';
import { Loader2 } from 'lucide-react';
import { useTranslations } from 'next-intl';
import { Badge } from '@/components/ui/badge';
import {
@@ -29,12 +30,13 @@ interface DiffDialogProps {
}
function DiffChipList({ title, items }: { title: string; items: string[] }) {
const t = useTranslations('configVersions');
return (
<div className='space-y-2'>
<div className='flex items-center justify-between gap-2'>
<p className='text-xs font-semibold'>{title}</p>
<Badge variant='outline' className='text-[10px] rounded-full'>
{items.length} 项
{t('itemCount', { count: items.length })}
</Badge>
</div>
{items.length > 0 ? (
@@ -50,16 +52,12 @@ function DiffChipList({ title, items }: { title: string; items: string[] }) {
))}
</div>
) : (
<p className='text-xs text-muted-foreground'>无变更</p>
<p className='text-xs text-muted-foreground'>{t('noChange')}</p>
)}
</div>
);
}
function renderOptionValue(value: string) {
return value === '' ? '空' : value;
}
export function DiffDialog({
open,
onOpenChange,
@@ -67,20 +65,19 @@ export function DiffDialog({
loading,
error,
}: DiffDialogProps) {
const t = useTranslations('configVersions');
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className='sm:max-w-3xl max-h-[85vh] overflow-y-auto'>
<DialogHeader>
<DialogTitle>配置差异</DialogTitle>
<DialogDescription>
对比当前待发布配置与已激活版本之间的差异。
</DialogDescription>
<DialogTitle>{t('diffTitle')}</DialogTitle>
<DialogDescription>{t('diffDesc')}</DialogDescription>
</DialogHeader>
{loading ? (
<div className='flex items-center justify-center gap-2 py-12 text-sm text-muted-foreground'>
<Loader2 className='size-4 animate-spin' />
正在加载差异数据...
{t('loadingDiff')}
</div>
) : error ? (
<p className='text-sm text-destructive'>{error}</p>
@@ -89,15 +86,15 @@ export function DiffDialog({
<div className='grid gap-3 sm:grid-cols-2 lg:grid-cols-4'>
<div className='rounded-lg border border-dashed p-3'>
<p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
激活版本
{t('activeVersion')}
</p>
<p className='mt-1 text-sm font-medium'>
{diff.active_version || '无'}
{diff.active_version || t('none')}
</p>
</div>
<div className='rounded-lg border border-dashed p-3'>
<p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
新增域名
{t('addedDomains')}
</p>
<p className='mt-1 text-lg font-semibold text-emerald-600'>
{diff.added_domains.length}
@@ -105,7 +102,7 @@ export function DiffDialog({
</div>
<div className='rounded-lg border border-dashed p-3'>
<p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
删除域名
{t('removedDomains')}
</p>
<p className='mt-1 text-lg font-semibold text-amber-600'>
{diff.removed_domains.length}
@@ -113,7 +110,7 @@ export function DiffDialog({
</div>
<div className='rounded-lg border border-dashed p-3'>
<p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
修改域名
{t('modifiedDomains')}
</p>
<p className='mt-1 text-lg font-semibold text-blue-600'>
{diff.modified_domains.length}
@@ -122,25 +119,38 @@ export function DiffDialog({
</div>
<div className='grid gap-4 md:grid-cols-3'>
<DiffChipList title='新增域名' items={diff.added_domains} />
<DiffChipList title='删除域名' items={diff.removed_domains} />
<DiffChipList title='修改域名' items={diff.modified_domains} />
<DiffChipList
title={t('addedDomains')}
items={diff.added_domains}
/>
<DiffChipList
title={t('removedDomains')}
items={diff.removed_domains}
/>
<DiffChipList
title={t('modifiedDomains')}
items={diff.modified_domains}
/>
</div>
<div className='flex flex-wrap gap-2'>
<Badge
variant={diff.main_config_changed ? 'destructive' : 'outline'}
>
主配置 {diff.main_config_changed ? '已变化' : '无变化'}
{diff.main_config_changed
? t('mainChanged')
: t('mainUnchanged')}
</Badge>
<Badge
variant={diff.waf_config_changed ? 'destructive' : 'outline'}
>
WAF {diff.waf_config_changed ? '已变化' : '无变化'}
{diff.waf_config_changed ? t('wafChanged') : t('wafUnchanged')}
</Badge>
<Badge variant='outline'>
网站数 {diff.active_website_count} →{' '}
{diff.current_website_count}
{t('websiteDelta', {
from: diff.active_website_count,
to: diff.current_website_count,
})}
</Badge>
</div>
@@ -150,13 +160,13 @@ export function DiffDialog({
<TableHeader className='bg-muted/40'>
<TableRow className='border-dashed hover:bg-transparent'>
<TableHead className='text-xs font-semibold'>
参数
{t('optionKey')}
</TableHead>
<TableHead className='text-xs font-semibold'>
激活值
{t('activeValue')}
</TableHead>
<TableHead className='text-xs font-semibold'>
待发布值
{t('pendingValue')}
</TableHead>
</TableRow>
</TableHeader>
@@ -167,10 +177,14 @@ export function DiffDialog({
{item.key}
</TableCell>
<TableCell className='text-xs font-mono text-muted-foreground'>
{renderOptionValue(item.previous_value)}
{item.previous_value === ''
? t('emptyValue')
: item.previous_value}
</TableCell>
<TableCell className='text-xs font-mono text-muted-foreground'>
{renderOptionValue(item.current_value)}
{item.current_value === ''
? t('emptyValue')
: item.current_value}
</TableCell>
</TableRow>
))}
@@ -179,7 +193,7 @@ export function DiffDialog({
</div>
) : (
<p className='text-xs text-muted-foreground'>
当前无 OpenResty 参数变化。
{t('noOptionChanges')}
</p>
)}
</div>