feat: 为 Provider 和 Routes 页面添加搜索功能

internal/domain/model.go

@@ -88,6 +88,9 @@ type Provider struct {
 	// 展示的名称
 	Name string `json:"name"`
 
+	// Logo URL 或 data URI
+	Logo string `json:"logo,omitempty"`
+
 	// 配置
 	Config *ProviderConfig `json:"config"`
 

web/src/components/routes/ClientTypeRoutesContent.tsx

@@ -48,11 +48,13 @@ import { AntigravityQuotasProvider } from '@/contexts/antigravity-quotas-context
 interface ClientTypeRoutesContentProps {
   clientType: ClientType;
   projectID: number; // 0 for global routes
+  searchQuery?: string; // Optional search query from parent
 }
 
 export function ClientTypeRoutesContent({
   clientType,
   projectID,
+  searchQuery = '',
 }: ClientTypeRoutesContentProps) {
   const [activeId, setActiveId] = useState<string | null>(null)
   const { data: providerStats = {} } = useProviderStats(clientType, projectID || undefined)
@@ -100,7 +102,16 @@ export function ClientTypeRoutesContent({
     });
 
     // Only show providers that have routes
-    const filteredItems = allItems.filter((item) => item.route);
+    let filteredItems = allItems.filter((item) => item.route);
+
+    // Apply search filter
+    if (searchQuery.trim()) {
+      const query = searchQuery.toLowerCase();
+      filteredItems = filteredItems.filter((item) =>
+        item.provider.name.toLowerCase().includes(query) ||
+        item.provider.type.toLowerCase().includes(query)
+      );
+    }
 
     return filteredItems.sort((a, b) => {
       if (a.route && b.route) return a.route.position - b.route.position;
@@ -110,15 +121,26 @@ export function ClientTypeRoutesContent({
       if (!a.isNative && b.isNative) return 1;
       return a.provider.name.localeCompare(b.provider.name);
     });
-  }, [providers, clientRoutes, clientType]);
+  }, [providers, clientRoutes, clientType, searchQuery]);
 
   // Get available providers (without routes yet)
   const availableProviders = useMemo((): Provider[] => {
-    return providers.filter((p) => {
+    let available = providers.filter((p) => {
       const hasRoute = clientRoutes.some((r) => Number(r.providerID) === Number(p.id));
       return !hasRoute;
     });
-  }, [providers, clientRoutes]);
+
+    // Apply search filter
+    if (searchQuery.trim()) {
+      const query = searchQuery.toLowerCase();
+      available = available.filter((p) =>
+        p.name.toLowerCase().includes(query) ||
+        p.type.toLowerCase().includes(query)
+      );
+    }
+
+    return available;
+  }, [providers, clientRoutes, searchQuery]);
 
   const activeItem = activeId ? items.find((item) => item.id === activeId) : null;
 

web/src/components/ui/model-input.tsx

@@ -48,6 +48,9 @@ const COMMON_MODELS = [
   { id: '*gpt*', name: 'All GPT models', provider: 'OpenAI' },
   { id: '*o1*', name: 'All o1 models', provider: 'OpenAI' },
   { id: '*o3*', name: 'All o3 models', provider: 'OpenAI' },
+  // NVIDIA/Meta wildcards
+  { id: '*llama*', name: 'All Llama models', provider: 'NVIDIA' },
+  { id: 'meta/*', name: 'All Meta models', provider: 'NVIDIA' },
   // OpenAI models
   { id: 'gpt-4o', name: 'GPT-4o', provider: 'OpenAI' },
   { id: 'gpt-4o-mini', name: 'GPT-4o Mini', provider: 'OpenAI' },
@@ -58,6 +61,15 @@ const COMMON_MODELS = [
   { id: 'o1-mini', name: 'o1 Mini', provider: 'OpenAI' },
   { id: 'o1-pro', name: 'o1 Pro', provider: 'OpenAI' },
   { id: 'o3-mini', name: 'o3 Mini', provider: 'OpenAI' },
+  // NVIDIA models
+  { id: 'minimaxai/minimax-m2.1', name: 'MiniMax M2.1', provider: 'NVIDIA' },
+  { id: 'z-ai/glm4.7', name: 'GLM 4.7', provider: 'NVIDIA' },
+  { id: 'deepseek-ai/deepseek-rl', name: 'DeepSeek RL', provider: 'NVIDIA' },
+  { id: 'qwen/qwen2.5-coder-32b-instruct', name: 'Qwen 2.5 Coder 32B', provider: 'NVIDIA' },
+  { id: 'openai/gpt-oss-120b', name: 'GPT OSS 120B', provider: 'NVIDIA' },
+  { id: 'google/gemma-3-27b-it', name: 'Gemma 3 27B', provider: 'NVIDIA' },
+  { id: 'meta/llama-4-maverick-17b-128e-instruct', name: 'Llama 4 Maverick 17B', provider: 'NVIDIA' },
+  { id: 'mistralai/devstral-2-123b-instruct-2512', name: 'Devstral 2 123B', provider: 'NVIDIA' },
   // Antigravity supported target models (use these as mapping targets)
   {
     id: 'claude-opus-4-5-thinking',

web/src/lib/transport/types.ts

@@ -46,6 +46,7 @@ export interface Provider {
   updatedAt: string;
   type: string;
   name: string;
+  logo?: string; // Logo URL or data URI
   config: ProviderConfig | null;
   supportedClientTypes: ClientType[];
 }

web/src/locales/en.json

@@ -36,7 +36,9 @@
     "days": "days",
     "hours": "hours",
     "global": "Global",
-    "initFailed": "Failed to Initialize"
+    "initFailed": "Failed to Initialize",
+    "search": "Search",
+    "searchProviders": "Search providers..."
   },
   "nav": {
     "dashboard": "Dashboard",
@@ -568,6 +570,10 @@
       "freeduck": {
         "name": "Free Duck",
         "description": "Free site · Claude Code only"
+      },
+      "nvidia": {
+        "name": "NVIDIA NIM",
+        "description": "NVIDIA NIM · OpenAI Compatible"
       }
     }
   }

web/src/locales/zh.json

@@ -36,7 +36,9 @@
     "days": "天",
     "hours": "小时",
     "global": "全局",
-    "initFailed": "初始化失败"
+    "initFailed": "初始化失败",
+    "search": "搜索",
+    "searchProviders": "搜索 Provider..."
   },
   "nav": {
     "dashboard": "仪表板",
@@ -567,6 +569,10 @@
       "freeduck": {
         "name": "Free Duck",
         "description": "免费站点 · 只有 Claude Code"
+      },
+      "nvidia": {
+        "name": "NVIDIA NIM",
+        "description": "NVIDIA NIM · OpenAI 兼容"
       }
     }
   }

web/src/pages/client-routes/index.tsx

@@ -3,14 +3,20 @@
  * 全局路由配置页面 - 显示当前 ClientType 的路由
  */
 
+import { useState } from 'react';
 import { useParams } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
+import { Search } from 'lucide-react';
 import { ClientIcon, getClientName } from '@/components/icons/client-icons';
 import type { ClientType } from '@/lib/transport';
 import { ClientTypeRoutesContent } from '@/components/routes/ClientTypeRoutesContent';
+import { Input } from '@/components/ui/input';
 
 export function ClientRoutesPage() {
+  const { t } = useTranslation();
   const { clientType } = useParams<{ clientType: string }>();
   const activeClientType = (clientType as ClientType) || 'claude';
+  const [searchQuery, setSearchQuery] = useState('');
 
   return (
     <div className="flex flex-col h-full bg-background">
@@ -29,11 +35,27 @@ export function ClientRoutesPage() {
             </p>
           </div>
         </div>
+        <div className="relative">
+          <Search
+            size={14}
+            className="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
+          />
+          <Input
+            placeholder={t('common.searchProviders')}
+            value={searchQuery}
+            onChange={(e) => setSearchQuery(e.target.value)}
+            className="pl-9 w-48"
+          />
+        </div>
       </div>
 
       {/* Content */}
       <div className="flex-1 min-w-0 overflow-hidden">
-        <ClientTypeRoutesContent clientType={activeClientType} projectID={0} />
+        <ClientTypeRoutesContent
+          clientType={activeClientType}
+          projectID={0}
+          searchQuery={searchQuery}
+        />
       </div>
     </div>
   );

web/src/pages/providers/components/custom-config-step.tsx

@@ -1,10 +1,11 @@
-import { Globe, ChevronLeft, Key, Check } from 'lucide-react';
+import { Globe, ChevronLeft, Key, Check, Plus, Trash2, ArrowRight } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
-import { useCreateProvider } from '@/hooks/queries';
+import { useCreateProvider, useCreateModelMapping } from '@/hooks/queries';
 import type { ClientType, CreateProviderData } from '@/lib/transport';
 import { ClientsConfigSection } from './clients-config-section';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
+import { ModelInput } from '@/components/ui/model-input';
 import { useProviderForm } from '../context/provider-form-context';
 import { useProviderNavigation } from '../hooks/use-provider-navigation';
 
@@ -13,6 +14,7 @@ export function CustomConfigStep() {
   const { formData, updateFormData, updateClient, isValid, isSaving, setSaving, saveStatus, setSaveStatus } = useProviderForm();
   const { goToSelectType, goToProviders } = useProviderNavigation();
   const createProvider = useCreateProvider();
+  const createModelMapping = useCreateModelMapping();
 
   const handleSave = async () => {
     if (!isValid()) return;
@@ -32,6 +34,7 @@ export function CustomConfigStep() {
       const data: CreateProviderData = {
         type: 'custom',
         name: formData.name,
+        logo: formData.logo,
         config: {
           custom: {
             baseURL: formData.baseURL,
@@ -42,7 +45,20 @@ export function CustomConfigStep() {
         supportedClientTypes,
       };
 
-      await createProvider.mutateAsync(data);
+      const provider = await createProvider.mutateAsync(data);
+
+      // Create model mappings if template has any
+      if (formData.modelMappings && formData.modelMappings.length > 0) {
+        for (const mapping of formData.modelMappings) {
+          await createModelMapping.mutateAsync({
+            scope: 'provider',
+            providerID: provider.id,
+            pattern: mapping.pattern,
+            target: mapping.target,
+          });
+        }
+      }
+
       setSaveStatus('success');
       setTimeout(() => goToProviders(), 500);
     } catch (error) {
@@ -153,6 +169,81 @@ export function CustomConfigStep() {
             <ClientsConfigSection clients={formData.clients} onUpdateClient={updateClient} />
           </div>
 
+          {/* Model Mapping Section */}
+          <div className="space-y-6">
+            <div className="flex items-center justify-between border-b border-border pb-2">
+              <h3 className="text-lg font-semibold text-text-primary">
+                {t('modelMappings.title')}
+              </h3>
+              <Button
+                variant="outline"
+                size="sm"
+                onClick={() => {
+                  const newMappings = [...(formData.modelMappings || []), { pattern: '', target: '' }];
+                  updateFormData({ modelMappings: newMappings });
+                }}
+              >
+                <Plus size={14} />
+                {t('routes.modelMapping.addMapping')}
+              </Button>
+            </div>
+
+            {formData.modelMappings && formData.modelMappings.length > 0 ? (
+              <div className="space-y-3">
+                {formData.modelMappings.map((mapping, index) => (
+                  <div key={index} className="flex items-center gap-3 p-3 bg-muted/50 rounded-lg">
+                    <div className="flex-1">
+                      <label className="text-xs text-muted-foreground mb-1 block">
+                        {t('settings.matchPattern')}
+                      </label>
+                      <Input
+                        type="text"
+                        value={mapping.pattern}
+                        onChange={(e) => {
+                          const newMappings = [...(formData.modelMappings || [])];
+                          newMappings[index] = { ...newMappings[index], pattern: e.target.value };
+                          updateFormData({ modelMappings: newMappings });
+                        }}
+                        placeholder="*claude*, *sonnet*, *"
+                        className="font-mono text-sm"
+                      />
+                    </div>
+                    <ArrowRight size={16} className="text-muted-foreground shrink-0 mt-5" />
+                    <div className="flex-1">
+                      <label className="text-xs text-muted-foreground mb-1 block">
+                        {t('settings.targetModel')}
+                      </label>
+                      <ModelInput
+                        value={mapping.target}
+                        onChange={(value) => {
+                          const newMappings = [...(formData.modelMappings || [])];
+                          newMappings[index] = { ...newMappings[index], target: value };
+                          updateFormData({ modelMappings: newMappings });
+                        }}
+                        placeholder={t('modelInput.selectOrEnter')}
+                      />
+                    </div>
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="shrink-0 mt-5 text-muted-foreground hover:text-destructive"
+                      onClick={() => {
+                        const newMappings = (formData.modelMappings || []).filter((_, i) => i !== index);
+                        updateFormData({ modelMappings: newMappings });
+                      }}
+                    >
+                      <Trash2 size={14} />
+                    </Button>
+                  </div>
+                ))}
+              </div>
+            ) : (
+              <div className="text-sm text-muted-foreground p-4 bg-muted/30 rounded-lg text-center">
+                {t('modelMappings.noMappings')}
+              </div>
+            )}
+          </div>
+
           {saveStatus === 'error' && (
             <div className="p-4 bg-error/10 border border-error/30 rounded-lg text-sm text-error flex items-center gap-2">
               <div className="w-1.5 h-1.5 rounded-full bg-error" />

web/src/pages/providers/components/select-type-step.tsx

@@ -41,6 +41,8 @@ export function SelectTypeStep() {
         selectedTemplate: templateId,
         name: template.name,
         clients: updatedClients,
+        modelMappings: template.modelMappings,
+        logo: template.logoUrl,
       });
 
       goToCustomConfig();