From d3aa8da4063b425b1ba2228caf20e5f0b4188aba Mon Sep 17 00:00:00 2001
From: shihao <3127647737@qq.com>
Date: Mon, 27 Apr 2026 17:11:16 +0800
Subject: [PATCH] Improve admin Chinese UI contrast

---
 .../src/app/admin/(secure)/dashboard/page.tsx |  2 +-
 .../admin/(secure)/provider-accounts/page.tsx | 19 ++++-
 .../app/admin/(secure)/system-config/page.tsx | 11 ++-
 frontend-web/src/app/admin/login/page.tsx     | 10 +--
 frontend-web/src/app/globals.css              | 71 +++++++++----------
 frontend-web/src/app/login/page.tsx           |  4 +-
 frontend-web/src/components/admin-shell.tsx   | 38 +++++-----
 frontend-web/src/components/register-form.tsx |  4 +-
 8 files changed, 89 insertions(+), 70 deletions(-)

diff --git a/frontend-web/src/app/admin/(secure)/dashboard/page.tsx b/frontend-web/src/app/admin/(secure)/dashboard/page.tsx
index b957f2e..a996c55 100644
--- a/frontend-web/src/app/admin/(secure)/dashboard/page.tsx
+++ b/frontend-web/src/app/admin/(secure)/dashboard/page.tsx
@@ -44,7 +44,7 @@ export default function DashboardPage() {
     <div className="admin-dashboard-stack">
       <section className="panel dashboard-stage">
         <div className="dashboard-stage-copy">
-          <span className="header-kicker">Control overview</span>
+          <span className="header-kicker">运营总览</span>
           <h3>统一观察用户经济、模型路由和任务健康度</h3>
           <p className="muted">
             后台围绕用户经济系统、模型供应商、任务状态和公共配置四条主线组织，适合持续运营而不是只做演示。
diff --git a/frontend-web/src/app/admin/(secure)/provider-accounts/page.tsx b/frontend-web/src/app/admin/(secure)/provider-accounts/page.tsx
index 6674951..9cdb535 100644
--- a/frontend-web/src/app/admin/(secure)/provider-accounts/page.tsx
+++ b/frontend-web/src/app/admin/(secure)/provider-accounts/page.tsx
@@ -5,6 +5,20 @@ import { useState } from "react";
 
 import { api } from "@/lib/api";
 
+const fieldLabels: Record<string, string> = {
+  provider_code: "供应商编码",
+  provider_name: "供应商名称",
+  api_format: "接口协议",
+  base_url: "接口地址",
+  api_key: "接口密钥",
+  api_secret: "接口密钥补充",
+  webhook_secret: "回调密钥",
+  timeout_seconds: "超时时间（秒）",
+  max_retries: "最大重试次数",
+  status: "状态",
+  remark: "备注",
+};
+
 export default function ProviderAccountsPage() {
   const [form, setForm] = useState({
     provider_code: "openai-backup",
@@ -17,7 +31,7 @@ export default function ProviderAccountsPage() {
     timeout_seconds: 120,
     max_retries: 3,
     status: 1,
-    remark: "backup route",
+    remark: "备用线路",
   });
   const query = useQuery({
     queryKey: ["provider-accounts"],
@@ -35,7 +49,7 @@ export default function ProviderAccountsPage() {
         <div className="form-stack">
           {Object.entries(form).map(([key, value]) => (
             <label className="field-label" key={key}>
-              {key}
+              {fieldLabels[key] ?? key}
               <input
                 value={String(value)}
                 onChange={(event) =>
@@ -60,4 +74,3 @@ export default function ProviderAccountsPage() {
     </div>
   );
 }
-
diff --git a/frontend-web/src/app/admin/(secure)/system-config/page.tsx b/frontend-web/src/app/admin/(secure)/system-config/page.tsx
index 9ac133e..52bd865 100644
--- a/frontend-web/src/app/admin/(secure)/system-config/page.tsx
+++ b/frontend-web/src/app/admin/(secure)/system-config/page.tsx
@@ -11,6 +11,15 @@ type ConfigRow = {
   groupName: string;
 };
 
+const fieldLabels: Record<string, string> = {
+  config_key: "配置键",
+  config_value: "配置值",
+  value_type: "值类型",
+  group_name: "配置分组",
+  description: "配置说明",
+  is_public: "是否公开",
+};
+
 export default function SystemConfigPage() {
   const [form, setForm] = useState({
     config_key: "site.notice",
@@ -36,7 +45,7 @@ export default function SystemConfigPage() {
         <div className="form-stack">
           {Object.entries(form).map(([key, value]) => (
             <label className="field-label" key={key}>
-              {key}
+              {fieldLabels[key] ?? key}
               <input
                 value={String(value)}
                 onChange={(event) =>
diff --git a/frontend-web/src/app/admin/login/page.tsx b/frontend-web/src/app/admin/login/page.tsx
index 6c8bad5..f7ca026 100644
--- a/frontend-web/src/app/admin/login/page.tsx
+++ b/frontend-web/src/app/admin/login/page.tsx
@@ -33,10 +33,10 @@ export default function AdminLoginPage() {
   return (
     <div className="admin-auth-page">
       <section className="admin-auth-copy">
-        <span className="admin-page-kicker">OPERATIONS CONSOLE</span>
-        <h1>AIVIDEO CONTROL SURFACE</h1>
+        <span className="admin-page-kicker">运营控制台</span>
+        <h1>AIVideo 后台管理系统</h1>
         <p>
-          用更克制的 dark console 管理模型、价格、订单、奖励和任务治理链路，让后台像控制面，而不是营销页。
+          管理模型、价格、订单、奖励和任务治理链路。后台界面以清晰、稳定、可审计为优先目标。
         </p>
 
         <div className="admin-auth-grid">
@@ -61,7 +61,7 @@ export default function AdminLoginPage() {
       <section className="admin-auth-panel">
         <form className="admin-auth-card" onSubmit={handleSubmit}>
           <div className="admin-auth-head">
-            <span className="admin-page-kicker">ADMIN ACCESS</span>
+            <span className="admin-page-kicker">管理员登录</span>
             <h2>登录控制台</h2>
             <p>进入管理员界面，处理配置、审计和异常任务。</p>
           </div>
@@ -96,7 +96,7 @@ export default function AdminLoginPage() {
             {error ? <div className="inline-feedback is-error">{error}</div> : null}
 
             <button className="primary-button" type="submit">
-              {loading ? "SIGNING IN..." : "ENTER CONSOLE"}
+              {loading ? "登录中..." : "进入控制台"}
               {loading ? null : <ArrowRight size={16} />}
             </button>
 
diff --git a/frontend-web/src/app/globals.css b/frontend-web/src/app/globals.css
index 31c89f8..825a68d 100644
--- a/frontend-web/src/app/globals.css
+++ b/frontend-web/src/app/globals.css
@@ -7,10 +7,10 @@
   --page-surface: #fffdf7;
   --page-surface-strong: #ffffff;
   --page-ink: #161816;
-  --page-ink-soft: rgba(22, 24, 22, 0.72);
-  --page-muted: rgba(22, 24, 22, 0.54);
-  --page-border: rgba(22, 24, 22, 0.14);
-  --page-border-soft: rgba(22, 24, 22, 0.08);
+  --page-ink-soft: #30332f;
+  --page-muted: #625d52;
+  --page-border: rgba(22, 24, 22, 0.2);
+  --page-border-soft: rgba(22, 24, 22, 0.12);
   --page-accent: #00a99d;
   --page-accent-hover: #008e84;
   --page-accent-strong: #073f3b;
@@ -1664,16 +1664,16 @@ p {
 .admin-auth-page,
 .admin-app-shell,
 .admin-loading-shell {
-  --admin-bg: #151712;
-  --admin-bg-soft: #1f2119;
-  --admin-surface: rgba(255, 249, 237, 0.055);
-  --admin-surface-hover: rgba(255, 249, 237, 0.09);
-  --admin-border: rgba(255, 249, 237, 0.12);
-  --admin-border-strong: rgba(255, 249, 237, 0.24);
-  --admin-text: #fff9ed;
-  --admin-text-soft: rgba(255, 249, 237, 0.68);
-  --admin-text-dim: rgba(255, 249, 237, 0.48);
-  --admin-accent: #00c2b2;
+  --admin-bg: #f3eee4;
+  --admin-bg-soft: #fffaf1;
+  --admin-surface: #fffdf8;
+  --admin-surface-hover: #f0f7f5;
+  --admin-border: #d8d0c2;
+  --admin-border-strong: #bfb5a5;
+  --admin-text: #181815;
+  --admin-text-soft: #3e3a33;
+  --admin-text-dim: #6a6257;
+  --admin-accent: #007a72;
   background: var(--admin-bg);
   color: var(--admin-text);
 }
@@ -1694,11 +1694,11 @@ p {
   align-content: space-between;
   gap: 28px;
   background:
-    linear-gradient(135deg, rgba(21, 23, 18, 1), rgba(41, 36, 25, 0.96)),
+    linear-gradient(135deg, #fffdf8, #ece3d5),
     repeating-linear-gradient(
       90deg,
-      rgba(255, 249, 237, 0.04) 0,
-      rgba(255, 249, 237, 0.04) 1px,
+      rgba(22, 24, 22, 0.045) 0,
+      rgba(22, 24, 22, 0.045) 1px,
       transparent 1px,
       transparent 86px
     );
@@ -1706,10 +1706,10 @@ p {
 
 .admin-auth-copy h1 {
   margin: 0;
-  max-width: 12ch;
+  max-width: 12em;
   font-size: 64px;
   line-height: 0.98;
-  font-family: var(--font-mono), Consolas, monospace;
+  font-family: var(--font-display), "PingFang SC", "Microsoft YaHei UI", sans-serif;
   font-weight: 800;
   letter-spacing: 0;
 }
@@ -1724,7 +1724,7 @@ p {
 
 .admin-page-kicker {
   color: var(--admin-accent);
-  font-family: var(--font-mono), Consolas, monospace;
+  font-family: var(--font-body), "PingFang SC", "Microsoft YaHei UI", sans-serif;
 }
 
 .admin-auth-grid {
@@ -1743,7 +1743,7 @@ p {
 }
 
 .admin-auth-info svg {
-  color: var(--page-warm);
+  color: var(--admin-accent);
 }
 
 .admin-auth-info strong {
@@ -1768,6 +1768,7 @@ p {
   border-radius: var(--radius-card);
   border: 1px solid var(--admin-border);
   background: var(--admin-surface);
+  box-shadow: var(--page-shadow-soft);
 }
 
 .admin-auth-head {
@@ -1795,7 +1796,7 @@ p {
 .admin-app-shell .field-label select,
 .admin-app-shell .field-label textarea {
   color: var(--admin-text);
-  background: rgba(255, 249, 237, 0.05);
+  background: #ffffff;
   border-color: var(--admin-border-strong);
 }
 
@@ -1811,15 +1812,15 @@ p {
 
 .admin-auth-page .primary-button,
 .admin-app-shell .primary-button {
-  background: #fff9ed;
-  color: #151712;
-  box-shadow: none;
+  background: #181815;
+  color: #fffdf8;
+  box-shadow: 0 10px 24px rgba(24, 24, 21, 0.16);
 }
 
 .admin-auth-page .ghost-button,
 .admin-app-shell .ghost-button,
 .admin-app-shell .danger-button {
-  background: transparent;
+  background: #fffdf8;
   color: var(--admin-text);
   border-color: var(--admin-border-strong);
   box-shadow: none;
@@ -1831,7 +1832,7 @@ p {
 
 .admin-auth-page .inline-feedback,
 .admin-app-shell .inline-feedback {
-  background: rgba(255, 249, 237, 0.05);
+  background: #fffdf8;
   border-color: var(--admin-border);
   color: var(--admin-text-soft);
 }
@@ -1859,7 +1860,7 @@ p {
   display: flex;
   flex-direction: column;
   gap: 18px;
-  background: #12140f;
+  background: #fffdf8;
 }
 
 .admin-rail-brand {
@@ -1872,7 +1873,6 @@ p {
 .admin-rail-kicker {
   color: var(--admin-text-soft);
   font-size: 11px;
-  font-family: var(--font-mono), Consolas, monospace;
   font-weight: 800;
 }
 
@@ -1880,7 +1880,7 @@ p {
   margin: 0;
   font-size: 30px;
   line-height: 1;
-  font-family: var(--font-mono), Consolas, monospace;
+  font-family: var(--font-display), "PingFang SC", "Microsoft YaHei UI", sans-serif;
   font-weight: 850;
   letter-spacing: 0;
 }
@@ -1907,7 +1907,6 @@ p {
   border-radius: var(--radius-card);
   color: var(--admin-text-soft);
   font-size: 12px;
-  font-family: var(--font-mono), Consolas, monospace;
   font-weight: 800;
 }
 
@@ -1941,7 +1940,6 @@ p {
 .admin-rail-user span {
   color: var(--admin-text-dim);
   font-size: 12px;
-  font-family: var(--font-mono), Consolas, monospace;
 }
 
 .admin-main-shell {
@@ -1985,7 +1983,6 @@ p {
   border-radius: 999px;
   color: var(--admin-text-soft);
   font-size: 12px;
-  font-family: var(--font-mono), Consolas, monospace;
   font-weight: 800;
 }
 
@@ -2004,7 +2001,7 @@ p {
 .admin-loading-shell .pulse-card {
   background: var(--admin-surface);
   border-color: var(--admin-border);
-  box-shadow: none;
+  box-shadow: var(--page-shadow-soft);
   color: var(--admin-text);
 }
 
@@ -2035,9 +2032,9 @@ p {
 
 .admin-app-shell .tab-chip.active,
 .admin-app-shell .segmented-button.active {
-  color: #151712;
-  border-color: #fff9ed;
-  background: #fff9ed;
+  color: #fffdf8;
+  border-color: #181815;
+  background: #181815;
 }
 
 .admin-app-shell .code-block {
diff --git a/frontend-web/src/app/login/page.tsx b/frontend-web/src/app/login/page.tsx
index d63d5e0..33b4bb9 100644
--- a/frontend-web/src/app/login/page.tsx
+++ b/frontend-web/src/app/login/page.tsx
@@ -34,7 +34,7 @@ export default function LoginPage() {
     <div className="auth-page auth-page-user">
       <section className="auth-showcase auth-showcase-user">
         <div className="auth-showcase-copy">
-          <span className="auth-showcase-kicker">AIVIDEO FOR CREATORS</span>
+          <span className="auth-showcase-kicker">创作者工作台</span>
           <h1>把创作体验打磨成真正能面对市场的产品，而不只是一个生成入口。</h1>
           <p>
             从提示词、素材引用到任务交付与积分体系，AIVideo
@@ -64,7 +64,7 @@ export default function LoginPage() {
       <section className="auth-form-column">
         <form className="auth-form-card" onSubmit={handleSubmit}>
           <div className="auth-form-head">
-            <span className="auth-form-kicker">Welcome Back</span>
+            <span className="auth-form-kicker">欢迎回来</span>
             <h2>登录 AIVideo</h2>
             <p>继续你的创作项目、素材库和任务队列。</p>
           </div>
diff --git a/frontend-web/src/components/admin-shell.tsx b/frontend-web/src/components/admin-shell.tsx
index dd597b6..c87f0a1 100644
--- a/frontend-web/src/components/admin-shell.tsx
+++ b/frontend-web/src/components/admin-shell.tsx
@@ -21,20 +21,20 @@ import { useEffect, useMemo } from "react";
 import { api } from "@/lib/api";
 
 const navigation = [
-  { href: "/admin/dashboard", label: "OVERVIEW", title: "系统总览", description: "查看平台总览、支付与任务健康度。", icon: ChartColumnBig },
-  { href: "/admin/users", label: "USERS", title: "用户管理", description: "维护用户状态、余额与资料。", icon: Users },
-  { href: "/admin/recharge-orders", label: "ORDERS", title: "充值订单", description: "跟踪充值流转与支付状态。", icon: Coins },
-  { href: "/admin/redeem-codes", label: "REDEEM", title: "兑换密钥", description: "管理兑换码的创建、停用和审计。", icon: KeySquare },
-  { href: "/admin/growth-rules", label: "GROWTH", title: "增长奖励", description: "配置注册奖励与邀请返利规则。", icon: Link2 },
-  { href: "/admin/invite-relations", label: "INVITES", title: "邀请关系", description: "查看邀请码链路与归因结果。", icon: Link2 },
-  { href: "/admin/provider-accounts", label: "ACCOUNTS", title: "供应商账号", description: "管理供应商账号和鉴权信息。", icon: Workflow },
-  { href: "/admin/provider-models", label: "MODELS", title: "供应商模型", description: "维护供应商模型能力与协议。", icon: Blocks },
-  { href: "/admin/video-models", label: "CATALOG", title: "平台模型", description: "定义前台可见的统一模型层。", icon: Package2 },
-  { href: "/admin/video-model-bindings", label: "ROUTING", title: "模型绑定", description: "决定平台模型到供应商模型的路由。", icon: Workflow },
-  { href: "/admin/pricing-rules", label: "PRICING", title: "价格规则", description: "按模型与版本维护积分定价。", icon: Coins },
-  { href: "/admin/video-tasks", label: "TASKS", title: "视频任务", description: "处理异常任务与追踪执行结果。", icon: Workflow },
-  { href: "/admin/callback-logs", label: "CALLBACKS", title: "回调日志", description: "查看供应商回调负载与异常线索。", icon: ChartColumnBig },
-  { href: "/admin/system-config", label: "CONFIG", title: "系统配置", description: "维护站点和策略配置。", icon: Settings2 },
+  { href: "/admin/dashboard", label: "系统总览", title: "系统总览", description: "查看平台总览、支付与任务健康度。", icon: ChartColumnBig },
+  { href: "/admin/users", label: "用户管理", title: "用户管理", description: "维护用户状态、余额与资料。", icon: Users },
+  { href: "/admin/recharge-orders", label: "充值订单", title: "充值订单", description: "跟踪充值流转与支付状态。", icon: Coins },
+  { href: "/admin/redeem-codes", label: "兑换码", title: "兑换密钥", description: "管理兑换码的创建、停用和审计。", icon: KeySquare },
+  { href: "/admin/growth-rules", label: "增长奖励", title: "增长奖励", description: "配置注册奖励与邀请返利规则。", icon: Link2 },
+  { href: "/admin/invite-relations", label: "邀请关系", title: "邀请关系", description: "查看邀请码链路与归因结果。", icon: Link2 },
+  { href: "/admin/provider-accounts", label: "供应商账号", title: "供应商账号", description: "管理供应商账号和鉴权信息。", icon: Workflow },
+  { href: "/admin/provider-models", label: "供应商模型", title: "供应商模型", description: "维护供应商模型能力与协议。", icon: Blocks },
+  { href: "/admin/video-models", label: "平台模型", title: "平台模型", description: "定义前台可见的统一模型层。", icon: Package2 },
+  { href: "/admin/video-model-bindings", label: "模型绑定", title: "模型绑定", description: "决定平台模型到供应商模型的路由。", icon: Workflow },
+  { href: "/admin/pricing-rules", label: "价格规则", title: "价格规则", description: "按模型与版本维护积分定价。", icon: Coins },
+  { href: "/admin/video-tasks", label: "视频任务", title: "视频任务", description: "处理异常任务与追踪执行结果。", icon: Workflow },
+  { href: "/admin/callback-logs", label: "回调日志", title: "回调日志", description: "查看供应商回调负载与异常线索。", icon: ChartColumnBig },
+  { href: "/admin/system-config", label: "系统配置", title: "系统配置", description: "维护站点和策略配置。", icon: Settings2 },
 ];
 
 export function AdminShell({ children }: { children: React.ReactNode }) {
@@ -71,7 +71,7 @@ export function AdminShell({ children }: { children: React.ReactNode }) {
     <div className="admin-app-shell">
       <aside className="admin-rail">
         <div className="admin-rail-brand">
-          <span className="admin-rail-kicker">AIVIDEO CONTROL</span>
+          <span className="admin-rail-kicker">运营后台</span>
           <h1>AIVideo</h1>
           <p>统一管理模型、价格、订单、奖励和任务治理链路。</p>
         </div>
@@ -108,7 +108,7 @@ export function AdminShell({ children }: { children: React.ReactNode }) {
             type="button"
           >
             <LogOut size={14} />
-            SIGN OUT
+            退出登录
           </button>
         </div>
       </aside>
@@ -116,13 +116,13 @@ export function AdminShell({ children }: { children: React.ReactNode }) {
       <main className="admin-main-shell">
         <header className="admin-page-hero">
           <div>
-            <span className="admin-page-kicker">OPERATIONS CONSOLE</span>
+            <span className="admin-page-kicker">运营控制台</span>
             <h2>{current.title}</h2>
             <p>{current.description}</p>
           </div>
           <div className="admin-page-tags">
-            <span>LIVE SESSION</span>
-            <span>RULES / TASKS / PRICING</span>
+            <span>当前会话有效</span>
+            <span>规则 / 任务 / 价格</span>
           </div>
         </header>
 
diff --git a/frontend-web/src/components/register-form.tsx b/frontend-web/src/components/register-form.tsx
index 04931f1..2fd2912 100644
--- a/frontend-web/src/components/register-form.tsx
+++ b/frontend-web/src/components/register-form.tsx
@@ -39,7 +39,7 @@ export function RegisterForm({ inviteCode = "" }: { inviteCode?: string }) {
     <div className="auth-page auth-page-user">
       <section className="auth-showcase auth-showcase-user">
         <div className="auth-showcase-copy">
-          <span className="auth-showcase-kicker">CREATE ACCOUNT</span>
+          <span className="auth-showcase-kicker">创建账号</span>
           <h1>把用户注册、增长奖励和首次创作，接成一个更完整的首日体验。</h1>
           <p>
             新用户不该在一堆跳转里迷失。注册后直接进入创作端，同时让奖励、邀请和钱包体系自然接入首登流程。
@@ -68,7 +68,7 @@ export function RegisterForm({ inviteCode = "" }: { inviteCode?: string }) {
       <section className="auth-form-column">
         <form className="auth-form-card" onSubmit={handleSubmit}>
           <div className="auth-form-head">
-            <span className="auth-form-kicker">Get Started</span>
+            <span className="auth-form-kicker">开始使用</span>
             <h2>创建用户账号</h2>
             <p>注册成功后将直接进入创作工作台。</p>
           </div>