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

接入无 URL 前缀的 zh-CN/en，顶栏与外观设置可切换语言；选择写入 cookie 后刷新生效。

frontend/app/(main)/admin/demo/page.tsx

@@ -4,6 +4,7 @@
 'use client';
 
 import * as React from 'react';
+import { useTranslations } from 'next-intl';
 import { Code } from 'lucide-react';
 
 import {
@@ -21,6 +22,7 @@ import { TableTab } from './tabs/table-tab';
 import { ControlsTab } from './tabs/controls-tab';
 
 export default function HeaderDemoPage() {
+  const t = useTranslations('admin.demo');
   const [activeTab, setActiveTab] = React.useState('dashboard');
 
   return (
@@ -30,7 +32,7 @@ export default function HeaderDemoPage() {
         <Code className='size-5 text-primary' />
         <div>
           <h1 className='text-2xl font-semibold tracking-tight'>
-            开发规范示例
+            {t('pageTitle')}
           </h1>
         </div>
       </div>
@@ -40,28 +42,28 @@ export default function HeaderDemoPage() {
         <CardHeader className='pb-3'>
           <div className='flex items-center gap-2'>
             <Code className='size-4 text-primary' />
-            <CardTitle className='text-base font-semibold'>规范说明</CardTitle>
+            <CardTitle className='text-base font-semibold'>
+              {t('specTitle')}
+            </CardTitle>
           </div>
-          <CardDescription>
-            此页面展示了后台 Sidebar 关联页面的标准标题栏布局，供开发参考。
-          </CardDescription>
+          <CardDescription>{t('specDescription')}</CardDescription>
         </CardHeader>
         <CardContent className='space-y-4'>
           <div className='space-y-2'>
             <h3 className='text-xs font-semibold uppercase tracking-wider text-muted-foreground'>
-              核心规范细节与编写原则：
+              {t('coreSpecTitle')}
             </h3>
             <ul className='list-disc pl-4 text-xs text-muted-foreground space-y-1.5'>
               <li>
-                <strong>结构专注</strong>
-                ：页面标题区必须保持绝对干净。请不要在标题下方放置任何描述段落或小字副标题，让页面在视线进入时保持极简与信息纯粹。
+                <strong>{t('rules.structureFocus.title')}</strong>
+                {t('rules.structureFocus.description')}
               </li>
               <li>
-                <strong>容器与上边距对齐</strong>：使用{' '}
+                <strong>{t('rules.containerAlignment.title')}</strong>：使用{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   flex items-center gap-2
                 </code>{' '}
-                作为标题行基础容器（不含下边框），外层统一使用{' '}
+                {t('rules.containerAlignment.description')}{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   py-6 px-1
                 </code>{' '}
@@ -69,53 +71,53 @@ export default function HeaderDemoPage() {
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   py-6
                 </code>
-                ) 进行上边距的视觉对齐，确保切换菜单时顶部高度感一致。
+                ) {t('rules.containerAlignment.description2')}
               </li>
               <li>
-                <strong>图标呈现</strong>：直接将 Lucide
-                图标组件嵌套于标题容器中，应用{' '}
+                <strong>{t('rules.iconPresentation.title')}</strong>：直接将
+                Lucide 图标组件嵌套于标题容器中，应用{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   size-5 text-primary
                 </code>{' '}
-                样式。禁止为图标包裹任何背景色小卡片、圆角或装饰性边框。
+                {t('rules.iconPresentation.description')}
               </li>
               <li>
-                <strong>文本样式标准</strong>：文本使用且仅使用{' '}
+                <strong>{t('rules.textStyle.title')}</strong>：文本使用且仅使用{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   {'h1 className="text-2xl font-semibold tracking-tight"'}
                 </code>
-                ，禁用字重加粗（如{' '}
+                {t('rules.textStyle.description')}{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   font-bold
                 </code>
-                ）或任何渐变色，保证全站字体一致性。
+                {t('rules.textStyle.description2')}
               </li>
               <li>
-                <strong>Tabs 模块化拆分</strong>：凡是带有多个 Tab
-                页切换的页面，**禁止**将所有 Tab
+                <strong>{t('rules.tabsModular.title')}</strong>：凡是带有多个
+                Tab 页切换的页面，**禁止**将所有 Tab
                 的渲染代码堆积在同一个物理页面主文件内。每个 Tab 页对应的
                 Content 必须单独拆分为独立组件文件（如{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   tabs/events-tab.tsx
                 </code>{' '}
-                或就近放在{' '}
+                {t('rules.tabsModular.description')}{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   components/
                 </code>{' '}
-                下），主页面文件只负责维护当前 Tab 的激活状态及外层骨架布局。
+                {t('rules.tabsModular.description2')}
               </li>
               <li>
-                <strong>复杂度驱动的区块拆分</strong>：不仅是 Tabs
-                切换，当一个页面代码行数超过 600
-                行时，必须将高密度区块拆分为子组件。路由专属、不复用的子组件应放在对应路由的特征目录中（如{' '}
+                <strong>{t('rules.complexityDriven.title')}</strong>：不仅是
+                Tabs 切换，当一个页面代码行数超过 600
+                {t('rules.complexityDriven.description')}{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   app/(main)/admin/database/components/
                 </code>
-                ），只有真正跨页面复用的组件才进入全局{' '}
+                {t('rules.complexityDriven.description2')}{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   components/common/
                 </code>
-                。典型标杆案例参考“数据管理” (
+                {t('rules.complexityDriven.description3')}{' '}
                 <code className='bg-muted px-1 py-0.5 rounded font-mono'>
                   /admin/database
                 </code>
@@ -145,19 +147,19 @@ export default function HeaderDemoPage() {
             value='dashboard'
             className='px-0 pb-2 text-xs font-semibold'
           >
-            仪表盘与指标卡片
+            {t('tabs.dashboard')}
           </TabsTrigger>
           <TabsTrigger
             value='table'
             className='px-0 pb-2 text-xs font-semibold'
           >
-            数据表格规范
+            {t('tabs.table')}
           </TabsTrigger>
           <TabsTrigger
             value='controls'
             className='px-0 pb-2 text-xs font-semibold'
           >
-            输入控件与表单
+            {t('tabs.controls')}
           </TabsTrigger>
         </TabsList>