Files
sub2apipay/src/components/OrderFilterBar.tsx
erio 2492031e13 feat: 全站多语言支持 (i18n),lang=en 显示英文,其余默认中文
新增 src/lib/locale.ts 作为统一多语言入口,覆盖前台支付链路、
管理后台、API/服务层错误文案,共 35 个文件。URL 参数 lang 全链路透传,
包括 Stripe return_url、页面跳转、layout html lang 属性等。

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:33:57 +08:00

36 lines
1.1 KiB
TypeScript

import type { Locale } from '@/lib/locale';
import { getFilterOptions, type OrderStatusFilter } from '@/lib/pay-utils';
interface OrderFilterBarProps {
isDark: boolean;
locale: Locale;
activeFilter: OrderStatusFilter;
onChange: (filter: OrderStatusFilter) => void;
}
export default function OrderFilterBar({ isDark, locale, activeFilter, onChange }: OrderFilterBarProps) {
return (
<div className="flex flex-wrap gap-2">
{getFilterOptions(locale).map((item) => (
<button
key={item.key}
type="button"
onClick={() => onChange(item.key)}
className={[
'rounded-full border px-3 py-1.5 text-xs font-medium transition-colors',
activeFilter === item.key
? isDark
? 'border-slate-500 bg-slate-700 text-slate-100'
: 'border-slate-400 bg-slate-900 text-white'
: isDark
? 'border-slate-600 text-slate-300 hover:bg-slate-800'
: 'border-slate-300 text-slate-600 hover:bg-slate-100',
].join(' ')}
>
{item.label}
</button>
))}
</div>
);
}