Merge remote-tracking branch 'origin/main'

apps/web/src/pages/admin/SystemSettingsPanel.tsx

@@ -1,10 +1,17 @@
 import { useEffect, useState, type FormEvent } from 'react';
-import { Database, Pencil, Plus, RotateCcw, Save, ServerCog, Trash2 } from 'lucide-react';
-import type { FileStorageChannel, FileStorageChannelUpsertRequest, FileStorageSettings, FileStorageSettingsUpdateRequest } from '@easyai-ai-gateway/contracts';
+import { Database, Pencil, Plus, RotateCcw, Save, ServerCog, Settings2, Trash2 } from 'lucide-react';
+import type { ClientCustomizationSettings, ClientCustomizationSettingsUpdateRequest, FileStorageChannel, FileStorageChannelUpsertRequest, FileStorageSettings, FileStorageSettingsUpdateRequest } from '@easyai-ai-gateway/contracts';
 import { Badge, Button, Card, CardContent, CardHeader, CardTitle, ConfirmDialog, FormDialog, Input, Label, Select, Tabs, Textarea } from '../../components/ui';
 import type { LoadState } from '../../types';
 
-type SystemSettingsTab = 'fileStorage';
+type SystemSettingsTab = 'fileStorage' | 'clientCustomization';
+
+type ClientCustomizationForm = {
+  clientEnglishName: string;
+  clientName: string;
+  iconPath: string;
+  platformName: string;
+};
 
 type FileStorageChannelForm = {
   apiKey: string;
@@ -48,10 +55,12 @@ const resultUploadPolicyOptions = [
 
 export function SystemSettingsPanel(props: {
   channels: FileStorageChannel[];
+  clientCustomizationSettings: ClientCustomizationSettings | null;
   message: string;
   settings: FileStorageSettings | null;
   state: LoadState;
   onDeleteFileStorageChannel: (channelId: string) => Promise<void>;
+  onSaveClientCustomizationSettings: (input: ClientCustomizationSettingsUpdateRequest) => Promise<void>;
   onSaveFileStorageChannel: (input: FileStorageChannelUpsertRequest, channelId?: string) => Promise<void>;
   onSaveFileStorageSettings: (input: FileStorageSettingsUpdateRequest) => Promise<void>;
 }) {
@@ -60,6 +69,7 @@ export function SystemSettingsPanel(props: {
   const [editingChannel, setEditingChannel] = useState<FileStorageChannel | null>(null);
   const [pendingDeleteChannel, setPendingDeleteChannel] = useState<FileStorageChannel | null>(null);
   const [form, setForm] = useState<FileStorageChannelForm>(() => defaultChannelForm());
+  const [clientCustomizationForm, setClientCustomizationForm] = useState<ClientCustomizationForm>(() => clientCustomizationSettingsToForm(props.clientCustomizationSettings));
   const [settingsPolicy, setSettingsPolicy] = useState(() => normalizeResultUploadPolicy(props.settings?.resultUploadPolicy));
   const [localError, setLocalError] = useState('');
 
@@ -67,6 +77,10 @@ export function SystemSettingsPanel(props: {
     setSettingsPolicy(normalizeResultUploadPolicy(props.settings?.resultUploadPolicy));
   }, [props.settings?.resultUploadPolicy]);
 
+  useEffect(() => {
+    setClientCustomizationForm(clientCustomizationSettingsToForm(props.clientCustomizationSettings));
+  }, [props.clientCustomizationSettings]);
+
   function openCreateDialog() {
     setEditingChannel(null);
     setForm(defaultChannelForm(`server-main-${Date.now().toString(36)}`));
@@ -122,6 +136,15 @@ export function SystemSettingsPanel(props: {
     }
   }
 
+  async function saveClientCustomization() {
+    setLocalError('');
+    try {
+      await props.onSaveClientCustomizationSettings(clientCustomizationFormToPayload(clientCustomizationForm));
+    } catch (err) {
+      setLocalError(err instanceof Error ? err.message : '客户端自定义设置保存失败');
+    }
+  }
+
   return (
     <div className="pageStack">
       <Card>
@@ -136,7 +159,10 @@ export function SystemSettingsPanel(props: {
           {(props.message || localError) && <p className="formMessage">{localError || props.message}</p>}
           <Tabs
             value={activeTab}
-            tabs={[{ value: 'fileStorage', label: '文件存储', icon: <Database size={15} /> }]}
+            tabs={[
+              { value: 'fileStorage', label: '文件存储', icon: <Database size={15} /> },
+              { value: 'clientCustomization', label: '客户端自定义', icon: <Settings2 size={15} /> },
+            ]}
             onValueChange={setActiveTab}
           />
         </CardContent>
@@ -216,6 +242,39 @@ export function SystemSettingsPanel(props: {
         </section>
       )}
 
+      {activeTab === 'clientCustomization' && (
+        <section className="fileStoragePanel">
+          <div className="fileStorageSettingsCard">
+            <div>
+              <strong>客户端自定义</strong>
+              <span>配置公开展示用的客户端名称、平台名和图标路径；公开 API 无需鉴权读取。</span>
+            </div>
+            <div className="formGrid two spanTwo">
+              <Label>
+                客户端名
+                <Input value={clientCustomizationForm.clientName} onChange={(event) => setClientCustomizationForm({ ...clientCustomizationForm, clientName: event.target.value })} placeholder="EasyAI AI Gateway" />
+              </Label>
+              <Label>
+                客户端英文名
+                <Input value={clientCustomizationForm.clientEnglishName} onChange={(event) => setClientCustomizationForm({ ...clientCustomizationForm, clientEnglishName: event.target.value })} placeholder="EasyAI AI Gateway" />
+              </Label>
+              <Label>
+                平台名
+                <Input value={clientCustomizationForm.platformName} onChange={(event) => setClientCustomizationForm({ ...clientCustomizationForm, platformName: event.target.value })} placeholder="EasyAI" />
+              </Label>
+              <Label>
+                Icon 路径/URL
+                <Input value={clientCustomizationForm.iconPath} onChange={(event) => setClientCustomizationForm({ ...clientCustomizationForm, iconPath: event.target.value })} placeholder="/logo.svg 或 https://..." />
+              </Label>
+            </div>
+            <Button type="button" onClick={saveClientCustomization} disabled={props.state === 'loading'}>
+              <Save size={15} />
+              保存客户端自定义
+            </Button>
+          </div>
+        </section>
+      )}
+
       <FormDialog
         ariaLabel={editingChannel ? '编辑文件存储渠道' : '新增文件存储渠道'}
         bodyClassName="fileStorageDialogBody"
@@ -308,6 +367,34 @@ export function SystemSettingsPanel(props: {
   );
 }
 
+function defaultClientCustomizationForm(): ClientCustomizationForm {
+  return {
+    clientEnglishName: 'EasyAI AI Gateway',
+    clientName: 'EasyAI AI Gateway',
+    iconPath: '',
+    platformName: 'EasyAI',
+  };
+}
+
+function clientCustomizationSettingsToForm(settings: ClientCustomizationSettings | null): ClientCustomizationForm {
+  const defaults = defaultClientCustomizationForm();
+  return {
+    clientEnglishName: settings?.clientEnglishName ?? defaults.clientEnglishName,
+    clientName: settings?.clientName ?? defaults.clientName,
+    iconPath: settings?.iconPath ?? defaults.iconPath,
+    platformName: settings?.platformName ?? defaults.platformName,
+  };
+}
+
+function clientCustomizationFormToPayload(form: ClientCustomizationForm): ClientCustomizationSettingsUpdateRequest {
+  return {
+    clientEnglishName: form.clientEnglishName.trim(),
+    clientName: form.clientName.trim(),
+    iconPath: form.iconPath.trim(),
+    platformName: form.platformName.trim(),
+  };
+}
+
 function defaultChannelForm(channelKey = ''): FileStorageChannelForm {
   return {
     apiKey: '',