merge: 合并 test 分支到 test-dev，解决冲突

解决的冲突文件：
- wire_gen.go: 合并 ConcurrencyService/CRSSyncService 参数和 userAttributeHandler
- gateway_handler.go: 合并 pkg/errors 和 antigravity 导入
- gateway_service.go: 合并 validateUpstreamBaseURL 和 GetAvailableModels
- config.example.yaml: 合并 billing/turnstile 配置和额外 gateway 选项

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/api/admin/index.ts

@@ -15,6 +15,7 @@ import subscriptionsAPI from './subscriptions'
 import usageAPI from './usage'
 import geminiAPI from './gemini'
 import antigravityAPI from './antigravity'
+import userAttributesAPI from './userAttributes'
 
 /**
  * Unified admin API object for convenient access
@@ -31,7 +32,8 @@ export const adminAPI = {
   subscriptions: subscriptionsAPI,
   usage: usageAPI,
   gemini: geminiAPI,
-  antigravity: antigravityAPI
+  antigravity: antigravityAPI,
+  userAttributes: userAttributesAPI
 }
 
 export {
@@ -46,7 +48,8 @@ export {
   subscriptionsAPI,
   usageAPI,
   geminiAPI,
-  antigravityAPI
+  antigravityAPI,
+  userAttributesAPI
 }
 
 export default adminAPI

frontend/src/api/admin/userAttributes.ts

@@ -0,0 +1,131 @@
+/**
+ * Admin User Attributes API endpoints
+ * Handles user custom attribute definitions and values
+ */
+
+import { apiClient } from '../client'
+import type {
+  UserAttributeDefinition,
+  UserAttributeValue,
+  CreateUserAttributeRequest,
+  UpdateUserAttributeRequest,
+  UserAttributeValuesMap
+} from '@/types'
+
+/**
+ * Get all attribute definitions
+ */
+export async function listDefinitions(): Promise<UserAttributeDefinition[]> {
+  const { data } = await apiClient.get<UserAttributeDefinition[]>('/admin/user-attributes')
+  return data
+}
+
+/**
+ * Get enabled attribute definitions only
+ */
+export async function listEnabledDefinitions(): Promise<UserAttributeDefinition[]> {
+  const { data } = await apiClient.get<UserAttributeDefinition[]>('/admin/user-attributes', {
+    params: { enabled: true }
+  })
+  return data
+}
+
+/**
+ * Create a new attribute definition
+ */
+export async function createDefinition(
+  request: CreateUserAttributeRequest
+): Promise<UserAttributeDefinition> {
+  const { data } = await apiClient.post<UserAttributeDefinition>('/admin/user-attributes', request)
+  return data
+}
+
+/**
+ * Update an attribute definition
+ */
+export async function updateDefinition(
+  id: number,
+  request: UpdateUserAttributeRequest
+): Promise<UserAttributeDefinition> {
+  const { data } = await apiClient.put<UserAttributeDefinition>(
+    `/admin/user-attributes/${id}`,
+    request
+  )
+  return data
+}
+
+/**
+ * Delete an attribute definition
+ */
+export async function deleteDefinition(id: number): Promise<{ message: string }> {
+  const { data } = await apiClient.delete<{ message: string }>(`/admin/user-attributes/${id}`)
+  return data
+}
+
+/**
+ * Reorder attribute definitions
+ */
+export async function reorderDefinitions(ids: number[]): Promise<{ message: string }> {
+  const { data } = await apiClient.put<{ message: string }>('/admin/user-attributes/reorder', {
+    ids
+  })
+  return data
+}
+
+/**
+ * Get user's attribute values
+ */
+export async function getUserAttributeValues(userId: number): Promise<UserAttributeValue[]> {
+  const { data } = await apiClient.get<UserAttributeValue[]>(
+    `/admin/users/${userId}/attributes`
+  )
+  return data
+}
+
+/**
+ * Update user's attribute values (batch)
+ */
+export async function updateUserAttributeValues(
+  userId: number,
+  values: UserAttributeValuesMap
+): Promise<{ message: string }> {
+  const { data } = await apiClient.put<{ message: string }>(
+    `/admin/users/${userId}/attributes`,
+    { values }
+  )
+  return data
+}
+
+/**
+ * Batch response type
+ */
+export interface BatchUserAttributesResponse {
+  attributes: Record<number, Record<number, string>>
+}
+
+/**
+ * Get attribute values for multiple users
+ */
+export async function getBatchUserAttributes(
+  userIds: number[]
+): Promise<BatchUserAttributesResponse> {
+  const { data } = await apiClient.post<BatchUserAttributesResponse>(
+    '/admin/user-attributes/batch',
+    { user_ids: userIds }
+  )
+  return data
+}
+
+export const userAttributesAPI = {
+  listDefinitions,
+  listEnabledDefinitions,
+  createDefinition,
+  updateDefinition,
+  deleteDefinition,
+  reorderDefinitions,
+  getUserAttributeValues,
+  updateUserAttributeValues,
+  getBatchUserAttributes
+}
+
+export default userAttributesAPI

frontend/src/api/admin/users.ts

@@ -10,7 +10,7 @@ import type { User, UpdateUserRequest, PaginatedResponse } from '@/types'
  * List all users with pagination
  * @param page - Page number (default: 1)
  * @param pageSize - Items per page (default: 20)
- * @param filters - Optional filters (status, role, search)
+ * @param filters - Optional filters (status, role, search, attributes)
  * @param options - Optional request options (signal)
  * @returns Paginated list of users
  */
@@ -21,17 +21,32 @@ export async function list(
     status?: 'active' | 'disabled'
     role?: 'admin' | 'user'
     search?: string
+    attributes?: Record<number, string>  // attributeId -> value
   },
   options?: {
     signal?: AbortSignal
   }
 ): Promise<PaginatedResponse<User>> {
+  // Build params with attribute filters in attr[id]=value format
+  const params: Record<string, any> = {
+    page,
+    page_size: pageSize,
+    status: filters?.status,
+    role: filters?.role,
+    search: filters?.search
+  }
+
+  // Add attribute filters as attr[id]=value
+  if (filters?.attributes) {
+    for (const [attrId, value] of Object.entries(filters.attributes)) {
+      if (value) {
+        params[`attr[${attrId}]`] = value
+      }
+    }
+  }
+
   const { data } = await apiClient.get<PaginatedResponse<User>>('/admin/users', {
-    params: {
-      page,
-      page_size: pageSize,
-      ...filters
-    },
+    params,
     signal: options?.signal
   })
   return data

frontend/src/api/user.ts

@@ -22,7 +22,6 @@ export async function getProfile(): Promise<User> {
  */
 export async function updateProfile(profile: {
   username?: string
-  wechat?: string
 }): Promise<User> {
   const { data } = await apiClient.put<User>('/user', profile)
   return data

frontend/src/components/account/AccountQuotaInfo.vue

@@ -0,0 +1,200 @@
+<template>
+  <div v-if="shouldShowQuota" class="flex items-center gap-2">
+    <!-- Tier Badge -->
+    <span :class="['badge text-xs px-2 py-0.5 rounded font-medium', tierBadgeClass]">
+      {{ tierLabel }}
+    </span>
+
+    <!-- 限流状态 -->
+    <span
+      v-if="!isRateLimited"
+      class="text-xs text-gray-400 dark:text-gray-500"
+    >
+      {{ t('admin.accounts.gemini.rateLimit.ok') }}
+    </span>
+    <span
+      v-else
+      :class="[
+        'text-xs font-medium',
+        isUrgent
+          ? 'text-red-600 dark:text-red-400 animate-pulse'
+          : 'text-amber-600 dark:text-amber-400'
+      ]"
+    >
+      {{ t('admin.accounts.gemini.rateLimit.limited', { time: resetCountdown }) }}
+    </span>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch, onUnmounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import type { Account, GeminiCredentials } from '@/types'
+
+const props = defineProps<{
+  account: Account
+}>()
+
+const { t } = useI18n()
+
+const now = ref(new Date())
+let timer: ReturnType<typeof setInterval> | null = null
+
+// 是否为 Code Assist OAuth
+// 判断逻辑与后端保持一致：project_id 存在即为 Code Assist
+const isCodeAssist = computed(() => {
+  const creds = props.account.credentials as GeminiCredentials | undefined
+  // 显式为 code_assist，或 legacy 情况（oauth_type 为空但 project_id 存在）
+  return creds?.oauth_type === 'code_assist' || (!creds?.oauth_type && !!creds?.project_id)
+})
+
+// 是否为 Google One OAuth
+const isGoogleOne = computed(() => {
+  const creds = props.account.credentials as GeminiCredentials | undefined
+  return creds?.oauth_type === 'google_one'
+})
+
+// 是否应该显示配额信息
+const shouldShowQuota = computed(() => {
+  return props.account.platform === 'gemini'
+})
+
+// Tier 标签文本
+const tierLabel = computed(() => {
+  const creds = props.account.credentials as GeminiCredentials | undefined
+
+  if (isCodeAssist.value) {
+    // GCP Code Assist: 显示 GCP tier
+    const tierMap: Record<string, string> = {
+      LEGACY: 'Free',
+      PRO: 'Pro',
+      ULTRA: 'Ultra',
+      'standard-tier': 'Standard',
+      'pro-tier': 'Pro',
+      'ultra-tier': 'Ultra'
+    }
+    return tierMap[creds?.tier_id || ''] || (creds?.tier_id ? 'GCP' : 'Unknown')
+  }
+
+  if (isGoogleOne.value) {
+    // Google One: tier 映射
+    const tierMap: Record<string, string> = {
+      AI_PREMIUM: 'AI Premium',
+      GOOGLE_ONE_STANDARD: 'Standard',
+      GOOGLE_ONE_BASIC: 'Basic',
+      FREE: 'Free',
+      GOOGLE_ONE_UNKNOWN: 'Personal',
+      GOOGLE_ONE_UNLIMITED: 'Unlimited'
+    }
+    return tierMap[creds?.tier_id || ''] || 'Personal'
+  }
+
+  // AI Studio 或其他
+  return 'Gemini'
+})
+
+// Tier Badge 样式
+const tierBadgeClass = computed(() => {
+  const creds = props.account.credentials as GeminiCredentials | undefined
+
+  if (isCodeAssist.value) {
+    // GCP Code Assist 样式
+    const tierColorMap: Record<string, string> = {
+      LEGACY: 'bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400',
+      PRO: 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400',
+      ULTRA: 'bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400',
+      'standard-tier': 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400',
+      'pro-tier': 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400',
+      'ultra-tier': 'bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400'
+    }
+    return (
+      tierColorMap[creds?.tier_id || ''] ||
+      'bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400'
+    )
+  }
+
+  if (isGoogleOne.value) {
+    // Google One tier 样式
+    const tierColorMap: Record<string, string> = {
+      AI_PREMIUM: 'bg-purple-100 text-purple-700 dark:bg-purple-900/30 dark:text-purple-400',
+      GOOGLE_ONE_STANDARD: 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400',
+      GOOGLE_ONE_BASIC: 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400',
+      FREE: 'bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400',
+      GOOGLE_ONE_UNKNOWN: 'bg-gray-100 text-gray-700 dark:bg-gray-900/30 dark:text-gray-400',
+      GOOGLE_ONE_UNLIMITED: 'bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400'
+    }
+    return tierColorMap[creds?.tier_id || ''] || 'bg-purple-100 text-purple-700 dark:bg-purple-900/30 dark:text-purple-400'
+  }
+
+  // AI Studio 默认样式：蓝色
+  return 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400'
+})
+
+// 是否限流
+const isRateLimited = computed(() => {
+  if (!props.account.rate_limit_reset_at) return false
+  const resetTime = Date.parse(props.account.rate_limit_reset_at)
+  // 防护：如果日期解析失败（NaN），则认为未限流
+  if (Number.isNaN(resetTime)) return false
+  return resetTime > now.value.getTime()
+})
+
+// 倒计时文本
+const resetCountdown = computed(() => {
+  if (!props.account.rate_limit_reset_at) return ''
+  const resetTime = Date.parse(props.account.rate_limit_reset_at)
+  // 防护：如果日期解析失败，显示 "-"
+  if (Number.isNaN(resetTime)) return '-'
+
+  const diffMs = resetTime - now.value.getTime()
+  if (diffMs <= 0) return t('admin.accounts.gemini.rateLimit.now')
+
+  const diffSeconds = Math.floor(diffMs / 1000)
+  const diffMinutes = Math.floor(diffSeconds / 60)
+  const diffHours = Math.floor(diffMinutes / 60)
+
+  if (diffMinutes < 1) return `${diffSeconds}s`
+  if (diffHours < 1) {
+    const secs = diffSeconds % 60
+    return `${diffMinutes}m ${secs}s`
+  }
+  const mins = diffMinutes % 60
+  return `${diffHours}h ${mins}m`
+})
+
+// 是否紧急（< 1分钟）
+const isUrgent = computed(() => {
+  if (!props.account.rate_limit_reset_at) return false
+  const resetTime = Date.parse(props.account.rate_limit_reset_at)
+  // 防护：如果日期解析失败，返回 false
+  if (Number.isNaN(resetTime)) return false
+
+  const diffMs = resetTime - now.value.getTime()
+  return diffMs > 0 && diffMs < 60000
+})
+
+// 监听限流状态，动态启动/停止定时器
+watch(
+  () => isRateLimited.value,
+  (limited) => {
+    if (limited && !timer) {
+      // 进入限流状态，启动定时器
+      timer = setInterval(() => {
+        now.value = new Date()
+      }, 1000)
+    } else if (!limited && timer) {
+      // 解除限流，停止定时器
+      clearInterval(timer)
+      timer = null
+    }
+  },
+  { immediate: true } // 立即执行，确保挂载时已限流的情况也能启动定时器
+)
+
+onUnmounted(() => {
+  if (timer !== null) {
+    clearInterval(timer)
+    timer = null
+  }
+})
+</script>

frontend/src/components/account/AccountStatusIndicator.vue

@@ -83,6 +83,14 @@
         ></div>
       </div>
     </div>
+
+    <!-- Tier Indicator -->
+    <span
+      v-if="tierDisplay"
+      class="inline-flex items-center rounded bg-blue-100 px-1.5 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-900/30 dark:text-blue-400"
+    >
+      {{ tierDisplay }}
+    </span>
   </div>
 </template>
 
@@ -140,4 +148,23 @@ const statusText = computed(() => {
   return props.account.status
 })
 
+// Computed: tier display
+const tierDisplay = computed(() => {
+  const credentials = props.account.credentials as Record<string, any> | undefined
+  const tierId = credentials?.tier_id
+  if (!tierId || tierId === 'unknown') return null
+
+  const tierMap: Record<string, string> = {
+    'free': 'Free',
+    'payg': 'Pay-as-you-go',
+    'pay-as-you-go': 'Pay-as-you-go',
+    'enterprise': 'Enterprise',
+    'LEGACY': 'Legacy',
+    'PRO': 'Pro',
+    'ULTRA': 'Ultra'
+  }
+
+  return tierMap[tierId] || tierId
+})
+
 </script>

frontend/src/components/account/AccountUsageCell.vue

@@ -169,6 +169,88 @@
       <div v-else class="text-xs text-gray-400">-</div>
     </template>
 
+    <!-- Gemini platform: show quota + local usage window -->
+    <template v-else-if="account.platform === 'gemini'">
+      <!-- 账户类型徽章 -->
+      <div v-if="geminiTierLabel" class="mb-1 flex items-center gap-1">
+        <span
+          :class="[
+            'inline-block rounded px-1.5 py-0.5 text-[10px] font-medium',
+            geminiTierClass
+          ]"
+        >
+          {{ geminiTierLabel }}
+        </span>
+        <!-- 帮助图标 -->
+        <span
+          class="group relative cursor-help"
+        >
+          <svg
+            class="h-3.5 w-3.5 text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300"
+            fill="currentColor"
+            viewBox="0 0 20 20"
+          >
+            <path
+              fill-rule="evenodd"
+              d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z"
+              clip-rule="evenodd"
+            />
+          </svg>
+          <span
+            class="pointer-events-none absolute left-0 top-full z-50 mt-1 w-80 whitespace-normal break-words rounded bg-gray-900 px-3 py-2 text-xs leading-relaxed text-white opacity-0 shadow-lg transition-opacity group-hover:opacity-100 dark:bg-gray-700"
+          >
+            <div class="font-semibold mb-1">{{ t('admin.accounts.gemini.quotaPolicy.title') }}</div>
+            <div class="mb-2 text-gray-300">{{ t('admin.accounts.gemini.quotaPolicy.note') }}</div>
+            <div class="space-y-1">
+              <div><strong>{{ geminiQuotaPolicyChannel }}:</strong></div>
+              <div class="pl-2">• {{ geminiQuotaPolicyLimits }}</div>
+              <div class="mt-2">
+                <a :href="geminiQuotaPolicyDocsUrl" target="_blank" class="text-blue-400 hover:text-blue-300 underline">
+                  {{ t('admin.accounts.gemini.quotaPolicy.columns.docs') }} →
+                </a>
+              </div>
+            </div>
+          </span>
+        </span>
+      </div>
+
+      <div class="space-y-1">
+        <div v-if="loading" class="space-y-1">
+          <div class="flex items-center gap-1">
+            <div class="h-3 w-[32px] animate-pulse rounded bg-gray-200 dark:bg-gray-700"></div>
+            <div class="h-1.5 w-8 animate-pulse rounded-full bg-gray-200 dark:bg-gray-700"></div>
+            <div class="h-3 w-[32px] animate-pulse rounded bg-gray-200 dark:bg-gray-700"></div>
+          </div>
+        </div>
+        <div v-else-if="error" class="text-xs text-red-500">
+          {{ error }}
+        </div>
+        <div v-else-if="geminiUsageAvailable" class="space-y-1">
+          <UsageProgressBar
+            v-if="usageInfo?.gemini_pro_daily"
+            :label="t('admin.accounts.usageWindow.geminiProDaily')"
+            :utilization="usageInfo.gemini_pro_daily.utilization"
+            :resets-at="usageInfo.gemini_pro_daily.resets_at"
+            :window-stats="usageInfo.gemini_pro_daily.window_stats"
+            :stats-title="t('admin.accounts.usageWindow.statsTitleDaily')"
+            color="indigo"
+          />
+          <UsageProgressBar
+            v-if="usageInfo?.gemini_flash_daily"
+            :label="t('admin.accounts.usageWindow.geminiFlashDaily')"
+            :utilization="usageInfo.gemini_flash_daily.utilization"
+            :resets-at="usageInfo.gemini_flash_daily.resets_at"
+            :window-stats="usageInfo.gemini_flash_daily.window_stats"
+            :stats-title="t('admin.accounts.usageWindow.statsTitleDaily')"
+            color="emerald"
+          />
+          <p class="mt-1 text-[9px] leading-tight text-gray-400 dark:text-gray-500 italic">
+            * {{ t('admin.accounts.gemini.quotaPolicy.simulatedNote') || 'Simulated quota' }}
+          </p>
+        </div>
+      </div>
+    </template>
+
     <!-- Other accounts: no usage window -->
     <template v-else>
       <div class="text-xs text-gray-400">-</div>
@@ -176,15 +258,20 @@
   </div>
 
   <!-- Non-OAuth/Setup-Token accounts -->
-  <div v-else class="text-xs text-gray-400">-</div>
+  <div v-else>
+    <!-- Gemini API Key accounts: show quota info -->
+    <AccountQuotaInfo v-if="account.platform === 'gemini'" :account="account" />
+    <div v-else class="text-xs text-gray-400">-</div>
+  </div>
 </template>
 
 <script setup lang="ts">
 import { ref, computed, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { adminAPI } from '@/api/admin'
-import type { Account, AccountUsageInfo } from '@/types'
+import type { Account, AccountUsageInfo, GeminiCredentials } from '@/types'
 import UsageProgressBar from './UsageProgressBar.vue'
+import AccountQuotaInfo from './AccountQuotaInfo.vue'
 
 const props = defineProps<{
   account: Account
@@ -201,6 +288,23 @@ const showUsageWindows = computed(
   () => props.account.type === 'oauth' || props.account.type === 'setup-token'
 )
 
+const shouldFetchUsage = computed(() => {
+  if (props.account.platform === 'anthropic') {
+    return props.account.type === 'oauth' || props.account.type === 'setup-token'
+  }
+  if (props.account.platform === 'gemini') {
+    return props.account.type === 'oauth'
+  }
+  return false
+})
+
+const geminiUsageAvailable = computed(() => {
+  return (
+    !!usageInfo.value?.gemini_pro_daily ||
+    !!usageInfo.value?.gemini_flash_daily
+  )
+})
+
 // OpenAI Codex usage computed properties
 const hasCodexUsage = computed(() => {
   const extra = props.account.extra
@@ -447,6 +551,108 @@ const antigravityTier = computed(() => {
   return null
 })
 
+// Gemini 账户类型（从 credentials 中提取）
+const geminiTier = computed(() => {
+  if (props.account.platform !== 'gemini') return null
+  const creds = props.account.credentials as GeminiCredentials | undefined
+  return creds?.tier_id || null
+})
+
+// Gemini 是否为 Code Assist OAuth
+const isGeminiCodeAssist = computed(() => {
+  if (props.account.platform !== 'gemini') return false
+  const creds = props.account.credentials as GeminiCredentials | undefined
+  return creds?.oauth_type === 'code_assist' || (!creds?.oauth_type && !!creds?.project_id)
+})
+
+// Gemini 账户类型显示标签
+const geminiTierLabel = computed(() => {
+  if (!geminiTier.value) return null
+
+  const creds = props.account.credentials as GeminiCredentials | undefined
+  const isGoogleOne = creds?.oauth_type === 'google_one'
+
+  if (isGoogleOne) {
+    // Google One tier 标签
+    const tierMap: Record<string, string> = {
+      AI_PREMIUM: t('admin.accounts.tier.aiPremium'),
+      GOOGLE_ONE_STANDARD: t('admin.accounts.tier.standard'),
+      GOOGLE_ONE_BASIC: t('admin.accounts.tier.basic'),
+      FREE: t('admin.accounts.tier.free'),
+      GOOGLE_ONE_UNKNOWN: t('admin.accounts.tier.personal'),
+      GOOGLE_ONE_UNLIMITED: t('admin.accounts.tier.unlimited')
+    }
+    return tierMap[geminiTier.value] || t('admin.accounts.tier.personal')
+  }
+
+  // Code Assist tier 标签
+  const tierMap: Record<string, string> = {
+    LEGACY: t('admin.accounts.tier.free'),
+    PRO: t('admin.accounts.tier.pro'),
+    ULTRA: t('admin.accounts.tier.ultra')
+  }
+  return tierMap[geminiTier.value] || null
+})
+
+// Gemini 账户类型徽章样式
+const geminiTierClass = computed(() => {
+  if (!geminiTier.value) return ''
+
+  const creds = props.account.credentials as GeminiCredentials | undefined
+  const isGoogleOne = creds?.oauth_type === 'google_one'
+
+  if (isGoogleOne) {
+    // Google One tier 颜色
+    const colorMap: Record<string, string> = {
+      AI_PREMIUM: 'bg-purple-100 text-purple-600 dark:bg-purple-900/40 dark:text-purple-300',
+      GOOGLE_ONE_STANDARD: 'bg-blue-100 text-blue-600 dark:bg-blue-900/40 dark:text-blue-300',
+      GOOGLE_ONE_BASIC: 'bg-green-100 text-green-600 dark:bg-green-900/40 dark:text-green-300',
+      FREE: 'bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300',
+      GOOGLE_ONE_UNKNOWN: 'bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300',
+      GOOGLE_ONE_UNLIMITED: 'bg-amber-100 text-amber-600 dark:bg-amber-900/40 dark:text-amber-300'
+    }
+    return colorMap[geminiTier.value] || 'bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300'
+  }
+
+  // Code Assist tier 颜色
+  switch (geminiTier.value) {
+    case 'LEGACY':
+      return 'bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300'
+    case 'PRO':
+      return 'bg-blue-100 text-blue-600 dark:bg-blue-900/40 dark:text-blue-300'
+    case 'ULTRA':
+      return 'bg-purple-100 text-purple-600 dark:bg-purple-900/40 dark:text-purple-300'
+    default:
+      return ''
+  }
+})
+
+// Gemini 配额政策信息
+const geminiQuotaPolicyChannel = computed(() => {
+  if (isGeminiCodeAssist.value) {
+    return t('admin.accounts.gemini.quotaPolicy.rows.cli.channel')
+  }
+  return t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.channel')
+})
+
+const geminiQuotaPolicyLimits = computed(() => {
+  if (isGeminiCodeAssist.value) {
+    if (geminiTier.value === 'PRO' || geminiTier.value === 'ULTRA') {
+      return t('admin.accounts.gemini.quotaPolicy.rows.cli.limitsPremium')
+    }
+    return t('admin.accounts.gemini.quotaPolicy.rows.cli.limitsFree')
+  }
+  // AI Studio - 默认显示免费层限制
+  return t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.limitsFree')
+})
+
+const geminiQuotaPolicyDocsUrl = computed(() => {
+  if (isGeminiCodeAssist.value) {
+    return 'https://cloud.google.com/products/gemini/code-assist#pricing'
+  }
+  return 'https://ai.google.dev/pricing'
+})
+
 // 账户类型显示标签
 const antigravityTierLabel = computed(() => {
   switch (antigravityTier.value) {
@@ -488,10 +694,7 @@ const hasIneligibleTiers = computed(() => {
 })
 
 const loadUsage = async () => {
-  // Fetch usage for Anthropic OAuth and Setup Token accounts
-  // OpenAI usage comes from account.extra field (updated during forwarding)
-  if (props.account.platform !== 'anthropic') return
-  if (props.account.type !== 'oauth' && props.account.type !== 'setup-token') return
+  if (!shouldFetchUsage.value) return
 
   loading.value = true
   error.value = null

frontend/src/components/account/CreateAccountModal.vue

@@ -373,8 +373,12 @@
               </svg>
             </div>
             <div>
-              <span class="block text-sm font-medium text-gray-900 dark:text-white">OAuth</span>
-              <span class="text-xs text-gray-500 dark:text-gray-400">{{ t('admin.accounts.types.googleOauth') }}</span>
+              <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                {{ t('admin.accounts.gemini.accountType.oauthTitle') }}
+              </span>
+              <span class="text-xs text-gray-500 dark:text-gray-400">
+                {{ t('admin.accounts.gemini.accountType.oauthDesc') }}
+              </span>
             </div>
           </button>
 
@@ -411,16 +415,92 @@
               </svg>
             </div>
             <div>
-              <span class="block text-sm font-medium text-gray-900 dark:text-white">API Key</span>
-              <span class="text-xs text-gray-500 dark:text-gray-400">AI Studio API Key</span>
+              <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                {{ t('admin.accounts.gemini.accountType.apiKeyTitle') }}
+              </span>
+              <span class="text-xs text-gray-500 dark:text-gray-400">
+                {{ t('admin.accounts.gemini.accountType.apiKeyDesc') }}
+              </span>
             </div>
           </button>
         </div>
 
+        <div
+          v-if="accountCategory === 'apikey'"
+          class="mt-3 rounded-lg border border-purple-200 bg-purple-50 px-3 py-2 text-xs text-purple-800 dark:border-purple-800/40 dark:bg-purple-900/20 dark:text-purple-200"
+        >
+          <p>{{ t('admin.accounts.gemini.accountType.apiKeyNote') }}</p>
+          <div class="mt-2 flex flex-wrap gap-2">
+            <a
+              :href="geminiHelpLinks.apiKey"
+              class="font-medium text-blue-600 hover:underline dark:text-blue-400"
+              target="_blank"
+              rel="noreferrer"
+            >
+              {{ t('admin.accounts.gemini.accountType.apiKeyLink') }}
+            </a>
+            <span class="text-purple-400">·</span>
+            <a
+              :href="geminiHelpLinks.aiStudioPricing"
+              class="font-medium text-blue-600 hover:underline dark:text-blue-400"
+              target="_blank"
+              rel="noreferrer"
+            >
+              {{ t('admin.accounts.gemini.accountType.quotaLink') }}
+            </a>
+          </div>
+        </div>
+
         <!-- OAuth Type Selection (only show when oauth-based is selected) -->
         <div v-if="accountCategory === 'oauth-based'" class="mt-4">
           <label class="input-label">{{ t('admin.accounts.oauth.gemini.oauthTypeLabel') }}</label>
           <div class="mt-2 grid grid-cols-2 gap-3">
+            <!-- Google One OAuth -->
+            <button
+              type="button"
+              @click="handleSelectGeminiOAuthType('google_one')"
+              :class="[
+                'flex items-center gap-3 rounded-lg border-2 p-3 text-left transition-all',
+                geminiOAuthType === 'google_one'
+                  ? 'border-purple-500 bg-purple-50 dark:bg-purple-900/20'
+                  : 'border-gray-200 hover:border-purple-300 dark:border-dark-600 dark:hover:border-purple-700'
+              ]"
+            >
+              <div
+                :class="[
+                  'flex h-8 w-8 items-center justify-center rounded-lg',
+                  geminiOAuthType === 'google_one'
+                    ? 'bg-purple-500 text-white'
+                    : 'bg-gray-100 text-gray-500 dark:bg-dark-600 dark:text-gray-400'
+                ]"
+              >
+                <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" />
+                </svg>
+              </div>
+              <div class="min-w-0">
+                <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                  Google One
+                </span>
+                <span class="text-xs text-gray-500 dark:text-gray-400">
+                  个人账号，享受 Google One 订阅配额
+                </span>
+                <div class="mt-2 flex flex-wrap gap-1">
+                  <span
+                    class="rounded bg-purple-100 px-2 py-0.5 text-[10px] font-semibold text-purple-700 dark:bg-purple-900/40 dark:text-purple-300"
+                  >
+                    推荐个人用户
+                  </span>
+                  <span
+                    class="rounded bg-emerald-100 px-2 py-0.5 text-[10px] font-semibold text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300"
+                  >
+                    无需 GCP
+                  </span>
+                </div>
+              </div>
+            </button>
+
+            <!-- GCP Code Assist OAuth -->
             <button
               type="button"
               @click="handleSelectGeminiOAuthType('code_assist')"
@@ -443,70 +523,204 @@
                   <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 15a4.5 4.5 0 004.5 4.5H18a3.75 3.75 0 001.332-7.257 3 3 0 00-3.758-3.848 5.25 5.25 0 00-10.233 2.33A4.502 4.502 0 002.25 15z" />
                 </svg>
               </div>
-              <div>
-                <span class="block text-sm font-medium text-gray-900 dark:text-white">{{ t('admin.accounts.types.codeAssist') }}</span>
-                <span class="block text-xs font-medium text-blue-600 dark:text-blue-400">{{ t('admin.accounts.oauth.gemini.needsProjectId') }}</span>
-                <span class="text-xs text-gray-500 dark:text-gray-400">{{ t('admin.accounts.oauth.gemini.needsProjectIdDesc') }}</span>
+              <div class="min-w-0">
+                <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                  GCP Code Assist
+                </span>
+                <span class="text-xs text-gray-500 dark:text-gray-400">
+                  企业级，需要 GCP 项目
+                </span>
+                <div class="mt-1 text-xs text-gray-500 dark:text-gray-400">
+                  需要激活 GCP 项目并绑定信用卡
+                  <a
+                    :href="geminiHelpLinks.gcpProject"
+                    class="ml-1 text-blue-600 hover:underline dark:text-blue-400"
+                    target="_blank"
+                    rel="noreferrer"
+                  >
+                    {{ t('admin.accounts.gemini.oauthType.gcpProjectLink') }}
+                  </a>
+                </div>
+                <div class="mt-2 flex flex-wrap gap-1">
+                  <span
+                    class="rounded bg-blue-100 px-2 py-0.5 text-[10px] font-semibold text-blue-700 dark:bg-blue-900/40 dark:text-blue-300"
+                  >
+                    企业用户
+                  </span>
+                  <span
+                    class="rounded bg-emerald-100 px-2 py-0.5 text-[10px] font-semibold text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300"
+                  >
+                    高并发
+                  </span>
+                </div>
               </div>
             </button>
+          </div>
 
-            <div class="group relative">
-              <button
-                type="button"
-                :disabled="!geminiAIStudioOAuthEnabled"
-                @click="handleSelectGeminiOAuthType('ai_studio')"
+          <!-- Advanced Options Toggle -->
+          <div class="mt-3">
+            <button
+              type="button"
+              @click="showAdvancedOAuth = !showAdvancedOAuth"
+              class="flex items-center gap-2 text-sm text-gray-600 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-200"
+            >
+              <svg
+                :class="['h-4 w-4 transition-transform', showAdvancedOAuth ? 'rotate-90' : '']"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+                stroke-width="2"
+              >
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7" />
+              </svg>
+              <span>{{ showAdvancedOAuth ? '隐藏' : '显示' }}高级选项（自建 OAuth Client）</span>
+            </button>
+          </div>
+
+          <!-- Custom OAuth Client (Advanced) -->
+          <div v-if="showAdvancedOAuth" class="mt-3 group relative">
+            <button
+              type="button"
+              :disabled="!geminiAIStudioOAuthEnabled"
+              @click="handleSelectGeminiOAuthType('ai_studio')"
+              :class="[
+                'flex w-full items-center gap-3 rounded-lg border-2 p-3 text-left transition-all',
+                !geminiAIStudioOAuthEnabled ? 'cursor-not-allowed opacity-60' : '',
+                geminiOAuthType === 'ai_studio'
+                  ? 'border-amber-500 bg-amber-50 dark:bg-amber-900/20'
+                  : 'border-gray-200 hover:border-amber-300 dark:border-dark-600 dark:hover:border-amber-700'
+              ]"
+            >
+              <div
                 :class="[
-                  'flex w-full items-center gap-3 rounded-lg border-2 p-3 text-left transition-all',
-                  !geminiAIStudioOAuthEnabled ? 'cursor-not-allowed opacity-60' : '',
+                  'flex h-8 w-8 items-center justify-center rounded-lg',
                   geminiOAuthType === 'ai_studio'
-                    ? 'border-purple-500 bg-purple-50 dark:bg-purple-900/20'
-                    : 'border-gray-200 hover:border-purple-300 dark:border-dark-600 dark:hover:border-purple-700'
+                    ? 'bg-amber-500 text-white'
+                    : 'bg-gray-100 text-gray-500 dark:bg-dark-600 dark:text-gray-400'
                 ]"
               >
-                <div
-                  :class="[
-                    'flex h-8 w-8 items-center justify-center rounded-lg',
-                    geminiOAuthType === 'ai_studio'
-                      ? 'bg-purple-500 text-white'
-                      : 'bg-gray-100 text-gray-500 dark:bg-dark-600 dark:text-gray-400'
-                  ]"
+                <svg
+                  class="h-4 w-4"
+                  fill="none"
+                  viewBox="0 0 24 24"
+                  stroke="currentColor"
+                  stroke-width="1.5"
                 >
-                  <svg
-                    class="h-4 w-4"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke="currentColor"
-                    stroke-width="1.5"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z"
-                    />
-                  </svg>
-                </div>
-                <div class="min-w-0">
-                  <span class="block text-sm font-medium text-gray-900 dark:text-white">AI Studio</span>
-                  <span class="block text-xs font-medium text-purple-600 dark:text-purple-400">{{
-                    t('admin.accounts.oauth.gemini.noProjectIdNeeded')
-                  }}</span>
-                  <span class="text-xs text-gray-500 dark:text-gray-400">{{
-                    t('admin.accounts.oauth.gemini.noProjectIdNeededDesc')
-                  }}</span>
-                </div>
-                <span
-                  v-if="!geminiAIStudioOAuthEnabled"
-                  class="ml-auto shrink-0 rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-700 dark:bg-amber-900/30 dark:text-amber-300"
-                >
-                  {{ t('admin.accounts.oauth.gemini.aiStudioNotConfiguredShort') }}
+                  <path
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    d="M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z"
+                  />
+                </svg>
+              </div>
+              <div class="min-w-0">
+                <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                  {{ t('admin.accounts.gemini.oauthType.customTitle') }}
                 </span>
-              </button>
-
-              <div
+                <span class="text-xs text-gray-500 dark:text-gray-400">
+                  {{ t('admin.accounts.gemini.oauthType.customDesc') }}
+                </span>
+                <div class="mt-1 text-xs text-gray-500 dark:text-gray-400">
+                  {{ t('admin.accounts.gemini.oauthType.customRequirement') }}
+                </div>
+                <div class="mt-2 flex flex-wrap gap-1">
+                  <span
+                    class="rounded bg-amber-100 px-2 py-0.5 text-[10px] font-semibold text-amber-700 dark:bg-amber-900/40 dark:text-amber-300"
+                  >
+                    {{ t('admin.accounts.gemini.oauthType.badges.orgManaged') }}
+                  </span>
+                  <span
+                    class="rounded bg-amber-100 px-2 py-0.5 text-[10px] font-semibold text-amber-700 dark:bg-amber-900/40 dark:text-amber-300"
+                  >
+                    {{ t('admin.accounts.gemini.oauthType.badges.adminRequired') }}
+                  </span>
+                </div>
+              </div>
+              <span
                 v-if="!geminiAIStudioOAuthEnabled"
-                class="pointer-events-none absolute right-0 top-full z-50 mt-2 w-80 rounded-md border border-amber-200 bg-amber-50 px-3 py-2 text-xs text-amber-800 opacity-0 shadow-lg transition-opacity group-hover:opacity-100 dark:border-amber-700 dark:bg-amber-900/40 dark:text-amber-200"
+                class="ml-auto shrink-0 rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-700 dark:bg-amber-900/30 dark:text-amber-300"
               >
-                {{ t('admin.accounts.oauth.gemini.aiStudioNotConfiguredTip') }}
+                {{ t('admin.accounts.oauth.gemini.aiStudioNotConfiguredShort') }}
+              </span>
+            </button>
+
+            <div
+              v-if="!geminiAIStudioOAuthEnabled"
+              class="pointer-events-none absolute right-0 top-full z-50 mt-2 w-80 rounded-md border border-amber-200 bg-amber-50 px-3 py-2 text-xs text-amber-800 opacity-0 shadow-lg transition-opacity group-hover:opacity-100 dark:border-amber-700 dark:bg-amber-900/40 dark:text-amber-200"
+            >
+              {{ t('admin.accounts.oauth.gemini.aiStudioNotConfiguredTip') }}
+            </div>
+          </div>
+        </div>
+
+        <div class="mt-4 rounded-lg border border-blue-200 bg-blue-50 p-4 text-xs text-blue-900 dark:border-blue-800/40 dark:bg-blue-900/20 dark:text-blue-200">
+          <div class="flex items-start gap-3">
+            <svg
+              class="h-5 w-5 flex-shrink-0 text-blue-600 dark:text-blue-400"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke="currentColor"
+            >
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+              />
+            </svg>
+            <div class="min-w-0">
+              <p class="text-sm font-medium text-blue-800 dark:text-blue-300">
+                {{ t('admin.accounts.gemini.setupGuide.title') }}
+              </p>
+              <div class="mt-2 space-y-2">
+                <div>
+                  <p class="font-semibold text-blue-800 dark:text-blue-300">
+                    {{ t('admin.accounts.gemini.setupGuide.checklistTitle') }}
+                  </p>
+                  <ul class="mt-1 list-disc space-y-1 pl-4">
+                    <li>
+                      {{ t('admin.accounts.gemini.setupGuide.checklistItems.usIp') }}
+                      <a
+                        :href="geminiHelpLinks.countryCheck"
+                        class="ml-1 text-blue-600 hover:underline dark:text-blue-400"
+                        target="_blank"
+                        rel="noreferrer"
+                      >
+                        {{ t('admin.accounts.gemini.setupGuide.links.countryCheck') }}
+                      </a>
+                    </li>
+                    <li>{{ t('admin.accounts.gemini.setupGuide.checklistItems.age') }}</li>
+                  </ul>
+                </div>
+                <div>
+                  <p class="font-semibold text-blue-800 dark:text-blue-300">
+                    {{ t('admin.accounts.gemini.setupGuide.activationTitle') }}
+                  </p>
+                  <ul class="mt-1 list-disc space-y-1 pl-4">
+                    <li>
+                      {{ t('admin.accounts.gemini.setupGuide.activationItems.geminiWeb') }}
+                      <a
+                        :href="geminiHelpLinks.geminiWebActivation"
+                        class="ml-1 text-blue-600 hover:underline dark:text-blue-400"
+                        target="_blank"
+                        rel="noreferrer"
+                      >
+                        {{ t('admin.accounts.gemini.setupGuide.links.geminiWebActivation') }}
+                      </a>
+                    </li>
+                    <li>
+                      {{ t('admin.accounts.gemini.setupGuide.activationItems.gcpProject') }}
+                      <a
+                        :href="geminiHelpLinks.gcpProject"
+                        class="ml-1 text-blue-600 hover:underline dark:text-blue-400"
+                        target="_blank"
+                        rel="noreferrer"
+                      >
+                        {{ t('admin.accounts.gemini.setupGuide.links.gcpProject') }}
+                      </a>
+                    </li>
+                  </ul>
+                </div>
               </div>
             </div>
           </div>
@@ -666,47 +880,7 @@
 
           <!-- Whitelist Mode -->
           <div v-if="modelRestrictionMode === 'whitelist'">
-            <div class="mb-3 rounded-lg bg-blue-50 p-3 dark:bg-blue-900/20">
-              <p class="text-xs text-blue-700 dark:text-blue-400">
-                <svg
-                  class="mr-1 inline h-4 w-4"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                >
-                  <path
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    stroke-width="2"
-                    d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-                  />
-                </svg>
-                {{ t('admin.accounts.selectAllowedModels') }}
-              </p>
-            </div>
-
-            <!-- Model Checkbox List -->
-            <div class="mb-3 grid grid-cols-2 gap-2">
-              <label
-                v-for="model in commonModels"
-                :key="model.value"
-                class="flex cursor-pointer items-center rounded-lg border p-3 transition-all hover:bg-gray-50 dark:border-dark-600 dark:hover:bg-dark-700"
-                :class="
-                  allowedModels.includes(model.value)
-                    ? 'border-primary-500 bg-primary-50 dark:bg-primary-900/20'
-                    : 'border-gray-200'
-                "
-              >
-                <input
-                  type="checkbox"
-                  :value="model.value"
-                  v-model="allowedModels"
-                  class="mr-2 rounded border-gray-300 text-primary-600 focus:ring-primary-500"
-                />
-                <span class="text-sm text-gray-700 dark:text-gray-300">{{ model.label }}</span>
-              </label>
-            </div>
-
+            <ModelWhitelistSelector v-model="allowedModels" :platform="form.platform" />
             <p class="text-xs text-gray-500 dark:text-gray-400">
               {{ t('admin.accounts.selectedModels', { count: allowedModels.length }) }}
               <span v-if="allowedModels.length === 0">{{
@@ -969,6 +1143,165 @@
             </div>
           </div>
         </div>
+
+        <!-- Gemini 配额与限流政策说明 -->
+        <div v-if="form.platform === 'gemini'" class="border-t border-gray-200 pt-4 dark:border-dark-600">
+          <div class="rounded-lg bg-gray-50 p-4 dark:bg-gray-800/40">
+            <div class="flex items-start gap-3">
+              <svg
+                class="h-5 w-5 flex-shrink-0 text-gray-500 dark:text-gray-400"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+              >
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"
+                />
+              </svg>
+              <div class="min-w-0">
+                <p class="text-sm font-medium text-gray-800 dark:text-gray-200">
+                  {{ t('admin.accounts.gemini.quotaPolicy.title') }}
+                </p>
+                <p class="mt-1 text-xs text-gray-600 dark:text-gray-400">
+                  {{ t('admin.accounts.gemini.quotaPolicy.note') }}
+                </p>
+                <div class="mt-3 overflow-x-auto">
+                  <table class="min-w-full text-xs text-gray-700 dark:text-gray-300">
+                    <thead>
+                      <tr class="border-b border-gray-200 dark:border-gray-700">
+                        <th class="px-2 py-1.5 text-left font-semibold">
+                          {{ t('admin.accounts.gemini.quotaPolicy.columns.channel') }}
+                        </th>
+                        <th class="px-2 py-1.5 text-left font-semibold">
+                          {{ t('admin.accounts.gemini.quotaPolicy.columns.account') }}
+                        </th>
+                        <th class="px-2 py-1.5 text-left font-semibold">
+                          {{ t('admin.accounts.gemini.quotaPolicy.columns.limits') }}
+                        </th>
+                        <th class="px-2 py-1.5 text-left font-semibold">
+                          {{ t('admin.accounts.gemini.quotaPolicy.columns.docs') }}
+                        </th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      <tr class="border-b border-gray-100 dark:border-gray-800">
+                        <td class="px-2 py-1.5 align-top" rowspan="2">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.cli.channel') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.cli.free') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.cli.limitsFree') }}
+                        </td>
+                        <td class="px-2 py-1.5 align-top" rowspan="2">
+                          <a
+                            :href="geminiQuotaDocs.codeAssist"
+                            class="text-blue-600 hover:underline dark:text-blue-400"
+                            target="_blank"
+                            rel="noreferrer"
+                          >
+                            {{ t('admin.accounts.gemini.quotaPolicy.docs.codeAssist') }}
+                          </a>
+                        </td>
+                      </tr>
+                      <tr class="border-b border-gray-100 dark:border-gray-800">
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.cli.premium') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.cli.limitsPremium') }}
+                        </td>
+                      </tr>
+                      <tr class="border-b border-gray-100 dark:border-gray-800">
+                        <td class="px-2 py-1.5 align-top">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.gcloud.channel') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.gcloud.account') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.gcloud.limits') }}
+                        </td>
+                        <td class="px-2 py-1.5 align-top">
+                          <a
+                            :href="geminiQuotaDocs.codeAssist"
+                            class="text-blue-600 hover:underline dark:text-blue-400"
+                            target="_blank"
+                            rel="noreferrer"
+                          >
+                            {{ t('admin.accounts.gemini.quotaPolicy.docs.codeAssist') }}
+                          </a>
+                        </td>
+                      </tr>
+                      <tr class="border-b border-gray-100 dark:border-gray-800">
+                        <td class="px-2 py-1.5 align-top" rowspan="2">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.channel') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.free') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.limitsFree') }}
+                        </td>
+                        <td class="px-2 py-1.5 align-top" rowspan="2">
+                          <a
+                            :href="geminiQuotaDocs.aiStudio"
+                            class="text-blue-600 hover:underline dark:text-blue-400"
+                            target="_blank"
+                            rel="noreferrer"
+                          >
+                            {{ t('admin.accounts.gemini.quotaPolicy.docs.aiStudio') }}
+                          </a>
+                        </td>
+                      </tr>
+                      <tr class="border-b border-gray-100 dark:border-gray-800">
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.paid') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.aiStudio.limitsPaid') }}
+                        </td>
+                      </tr>
+                      <tr>
+                        <td class="px-2 py-1.5 align-top" rowspan="2">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.customOAuth.channel') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.customOAuth.free') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.customOAuth.limitsFree') }}
+                        </td>
+                        <td class="px-2 py-1.5 align-top" rowspan="2">
+                          <a
+                            :href="geminiQuotaDocs.vertex"
+                            class="text-blue-600 hover:underline dark:text-blue-400"
+                            target="_blank"
+                            rel="noreferrer"
+                          >
+                            {{ t('admin.accounts.gemini.quotaPolicy.docs.vertex') }}
+                          </a>
+                        </td>
+                      </tr>
+                      <tr>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.customOAuth.paid') }}
+                        </td>
+                        <td class="px-2 py-1.5">
+                          {{ t('admin.accounts.gemini.quotaPolicy.rows.customOAuth.limitsPaid') }}
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
 
       <!-- Intercept Warmup Requests (Anthropic only) -->
@@ -1176,6 +1509,7 @@
 import { ref, reactive, computed, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useAppStore } from '@/stores/app'
+import { claudeModels, getPresetMappingsByPlatform, getModelsByPlatform, commonErrorCodes, buildModelMappingObject } from '@/composables/useModelWhitelist'
 import { useAuthStore } from '@/stores/auth'
 import { adminAPI } from '@/api/admin'
 import {
@@ -1190,6 +1524,7 @@ import type { Proxy, Group, AccountPlatform, AccountType } from '@/types'
 import BaseDialog from '@/components/common/BaseDialog.vue'
 import ProxySelector from '@/components/common/ProxySelector.vue'
 import GroupSelector from '@/components/common/GroupSelector.vue'
+import ModelWhitelistSelector from '@/components/account/ModelWhitelistSelector.vue'
 import OAuthAuthorizationFlow from './OAuthAuthorizationFlow.vue'
 
 // Type for exposed OAuthAuthorizationFlow component
@@ -1299,181 +1634,26 @@ const selectedErrorCodes = ref<number[]>([])
 const customErrorCodeInput = ref<number | null>(null)
 const interceptWarmupRequests = ref(false)
 const mixedScheduling = ref(false) // For antigravity accounts: enable mixed scheduling
-const geminiOAuthType = ref<'code_assist' | 'ai_studio'>('code_assist')
+const geminiOAuthType = ref<'code_assist' | 'google_one' | 'ai_studio'>('google_one')
 const geminiAIStudioOAuthEnabled = ref(false)
+const showAdvancedOAuth = ref(false)
 
-// Common models for whitelist - Anthropic
-const anthropicModels = [
-  { value: 'claude-opus-4-5-20251101', label: 'Claude Opus 4.5' },
-  { value: 'claude-sonnet-4-20250514', label: 'Claude Sonnet 4' },
-  { value: 'claude-sonnet-4-5-20250929', label: 'Claude Sonnet 4.5' },
-  { value: 'claude-3-5-haiku-20241022', label: 'Claude 3.5 Haiku' },
-  { value: 'claude-haiku-4-5-20251001', label: 'Claude Haiku 4.5' },
-  { value: 'claude-3-opus-20240229', label: 'Claude 3 Opus' },
-  { value: 'claude-3-5-sonnet-20241022', label: 'Claude 3.5 Sonnet' },
-  { value: 'claude-3-haiku-20240307', label: 'Claude 3 Haiku' }
-]
+const geminiQuotaDocs = {
+  codeAssist: 'https://developers.google.com/gemini-code-assist/resources/quotas',
+  aiStudio: 'https://ai.google.dev/pricing',
+  vertex: 'https://cloud.google.com/vertex-ai/generative-ai/docs/quotas'
+}
 
-// Common models for whitelist - OpenAI
-const openaiModels = [
-  { value: 'gpt-5.2-2025-12-11', label: 'GPT-5.2' },
-  { value: 'gpt-5.2-codex', label: 'GPT-5.2 Codex' },
-  { value: 'gpt-5.1-codex-max', label: 'GPT-5.1 Codex Max' },
-  { value: 'gpt-5.1-codex', label: 'GPT-5.1 Codex' },
-  { value: 'gpt-5.1-2025-11-13', label: 'GPT-5.1' },
-  { value: 'gpt-5.1-codex-mini', label: 'GPT-5.1 Codex Mini' },
-  { value: 'gpt-5-2025-08-07', label: 'GPT-5' }
-]
-
-// Common models for whitelist - Gemini
-const geminiModels = [
-  { value: 'gemini-2.0-flash', label: 'Gemini 2.0 Flash' },
-  { value: 'gemini-2.0-flash-lite', label: 'Gemini 2.0 Flash Lite' },
-  { value: 'gemini-1.5-pro', label: 'Gemini 1.5 Pro' },
-  { value: 'gemini-1.5-flash', label: 'Gemini 1.5 Flash' }
-]
-
-// Computed: current models based on platform
-const commonModels = computed(() => {
-  if (form.platform === 'openai') return openaiModels
-  if (form.platform === 'gemini') return geminiModels
-  return anthropicModels
-})
-
-// Preset mappings for quick add - Anthropic
-const anthropicPresetMappings = [
-  {
-    label: 'Sonnet 4',
-    from: 'claude-sonnet-4-20250514',
-    to: 'claude-sonnet-4-20250514',
-    color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400'
-  },
-  {
-    label: 'Sonnet 4.5',
-    from: 'claude-sonnet-4-5-20250929',
-    to: 'claude-sonnet-4-5-20250929',
-    color:
-      'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400'
-  },
-  {
-    label: 'Opus 4.5',
-    from: 'claude-opus-4-5-20251101',
-    to: 'claude-opus-4-5-20251101',
-    color:
-      'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400'
-  },
-  {
-    label: 'Haiku 3.5',
-    from: 'claude-3-5-haiku-20241022',
-    to: 'claude-3-5-haiku-20241022',
-    color: 'bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-400'
-  },
-  {
-    label: 'Haiku 4.5',
-    from: 'claude-haiku-4-5-20251001',
-    to: 'claude-haiku-4-5-20251001',
-    color:
-      'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400'
-  },
-  {
-    label: 'Opus->Sonnet',
-    from: 'claude-opus-4-5-20251101',
-    to: 'claude-sonnet-4-5-20250929',
-    color: 'bg-amber-100 text-amber-700 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-400'
-  }
-]
-
-// Preset mappings for quick add - OpenAI
-const openaiPresetMappings = [
-  {
-    label: 'GPT-5.2',
-    from: 'gpt-5.2-2025-12-11',
-    to: 'gpt-5.2-2025-12-11',
-    color: 'bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-400'
-  },
-  {
-    label: 'GPT-5.2 Codex',
-    from: 'gpt-5.2-codex',
-    to: 'gpt-5.2-codex',
-    color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400'
-  },
-  {
-    label: 'GPT-5.1 Codex',
-    from: 'gpt-5.1-codex',
-    to: 'gpt-5.1-codex',
-    color:
-      'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400'
-  },
-  {
-    label: 'Codex Max',
-    from: 'gpt-5.1-codex-max',
-    to: 'gpt-5.1-codex-max',
-    color:
-      'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400'
-  },
-  {
-    label: 'Codex Mini',
-    from: 'gpt-5.1-codex-mini',
-    to: 'gpt-5.1-codex-mini',
-    color:
-      'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400'
-  },
-  {
-    label: 'Max->Codex',
-    from: 'gpt-5.1-codex-max',
-    to: 'gpt-5.1-codex',
-    color: 'bg-amber-100 text-amber-700 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-400'
-  }
-]
-
-// Preset mappings for quick add - Gemini
-const geminiPresetMappings = [
-  {
-    label: 'Flash',
-    from: 'gemini-2.0-flash',
-    to: 'gemini-2.0-flash',
-    color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400'
-  },
-  {
-    label: 'Flash Lite',
-    from: 'gemini-2.0-flash-lite',
-    to: 'gemini-2.0-flash-lite',
-    color:
-      'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400'
-  },
-  {
-    label: '1.5 Pro',
-    from: 'gemini-1.5-pro',
-    to: 'gemini-1.5-pro',
-    color:
-      'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400'
-  },
-  {
-    label: '1.5 Flash',
-    from: 'gemini-1.5-flash',
-    to: 'gemini-1.5-flash',
-    color:
-      'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400'
-  }
-]
+const geminiHelpLinks = {
+  apiKey: 'https://aistudio.google.com/app/apikey',
+  aiStudioPricing: 'https://ai.google.dev/pricing',
+  gcpProject: 'https://console.cloud.google.com/welcome/new',
+  geminiWebActivation: 'https://gemini.google.com/gems/create?hl=en-US',
+  countryCheck: 'https://policies.google.com/country-association-form'
+}
 
 // Computed: current preset mappings based on platform
-const presetMappings = computed(() => {
-  if (form.platform === 'openai') return openaiPresetMappings
-  if (form.platform === 'gemini') return geminiPresetMappings
-  return anthropicPresetMappings
-})
-
-// Common HTTP error codes for quick selection
-const commonErrorCodes = [
-  { value: 401, label: 'Unauthorized' },
-  { value: 403, label: 'Forbidden' },
-  { value: 429, label: 'Rate Limit' },
-  { value: 500, label: 'Server Error' },
-  { value: 502, label: 'Bad Gateway' },
-  { value: 503, label: 'Unavailable' },
-  { value: 529, label: 'Overloaded' }
-]
+const presetMappings = computed(() => getPresetMappingsByPlatform(form.platform))
 
 const form = reactive({
   name: '',
@@ -1511,7 +1691,10 @@ const canExchangeCode = computed(() => {
 watch(
   () => props.show,
   (newVal) => {
-    if (!newVal) {
+    if (newVal) {
+      // Modal opened - fill related models
+      allowedModels.value = [...getModelsByPlatform(form.platform)]
+    } else {
       resetForm()
     }
   }
@@ -1577,7 +1760,7 @@ watch(
   { immediate: true }
 )
 
-const handleSelectGeminiOAuthType = (oauthType: 'code_assist' | 'ai_studio') => {
+const handleSelectGeminiOAuthType = (oauthType: 'code_assist' | 'google_one' | 'ai_studio') => {
   if (oauthType === 'ai_studio' && !geminiAIStudioOAuthEnabled.value) {
     appStore.showError(t('admin.accounts.oauth.gemini.aiStudioNotConfigured'))
     return
@@ -1585,6 +1768,16 @@ const handleSelectGeminiOAuthType = (oauthType: 'code_assist' | 'ai_studio') =>
   geminiOAuthType.value = oauthType
 }
 
+// Auto-fill related models when switching to whitelist mode or changing platform
+watch(
+  [modelRestrictionMode, () => form.platform],
+  ([newMode]) => {
+    if (newMode === 'whitelist') {
+      allowedModels.value = [...getModelsByPlatform(form.platform)]
+    }
+  }
+)
+
 // Model mapping helpers
 const addModelMapping = () => {
   modelMappings.value.push({ from: '', to: '' })
@@ -1595,9 +1788,7 @@ const removeModelMapping = (index: number) => {
 }
 
 const addPresetMapping = (from: string, to: string) => {
-  // Check if mapping already exists
-  const exists = modelMappings.value.some((m) => m.from === from)
-  if (exists) {
+  if (modelMappings.value.some((m) => m.from === from)) {
     appStore.showInfo(t('admin.accounts.mappingExists', { model: from }))
     return
   }
@@ -1637,28 +1828,6 @@ const removeErrorCode = (code: number) => {
   }
 }
 
-const buildModelMappingObject = (): Record<string, string> | null => {
-  const mapping: Record<string, string> = {}
-
-  if (modelRestrictionMode.value === 'whitelist') {
-    // Whitelist mode: map model to itself
-    for (const model of allowedModels.value) {
-      mapping[model] = model
-    }
-  } else {
-    // Mapping mode: use custom mappings
-    for (const m of modelMappings.value) {
-      const from = m.from.trim()
-      const to = m.to.trim()
-      if (from && to) {
-        mapping[from] = to
-      }
-    }
-  }
-
-  return Object.keys(mapping).length > 0 ? mapping : null
-}
-
 // Methods
 const resetForm = () => {
   step.value = 1
@@ -1676,7 +1845,7 @@ const resetForm = () => {
   apiKeyValue.value = ''
   modelMappings.value = []
   modelRestrictionMode.value = 'whitelist'
-  allowedModels.value = []
+  allowedModels.value = [...claudeModels] // Default fill related models
   customErrorCodesEnabled.value = false
   selectedErrorCodes.value = []
   customErrorCodeInput.value = null
@@ -1725,7 +1894,7 @@ const handleSubmit = async () => {
   }
 
   // Add model mapping if configured
-  const modelMapping = buildModelMappingObject()
+  const modelMapping = buildModelMappingObject(modelRestrictionMode.value, allowedModels.value, modelMappings.value)
   if (modelMapping) {
     credentials.model_mapping = modelMapping
   }

frontend/src/components/account/EditAccountModal.vue

@@ -111,47 +111,7 @@
 
           <!-- Whitelist Mode -->
           <div v-if="modelRestrictionMode === 'whitelist'">
-            <div class="mb-3 rounded-lg bg-blue-50 p-3 dark:bg-blue-900/20">
-              <p class="text-xs text-blue-700 dark:text-blue-400">
-                <svg
-                  class="mr-1 inline h-4 w-4"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                >
-                  <path
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    stroke-width="2"
-                    d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-                  />
-                </svg>
-                {{ t('admin.accounts.selectAllowedModels') }}
-              </p>
-            </div>
-
-            <!-- Model Checkbox List -->
-            <div class="mb-3 grid grid-cols-2 gap-2">
-              <label
-                v-for="model in commonModels"
-                :key="model.value"
-                class="flex cursor-pointer items-center rounded-lg border p-3 transition-all hover:bg-gray-50 dark:border-dark-600 dark:hover:bg-dark-700"
-                :class="
-                  allowedModels.includes(model.value)
-                    ? 'border-primary-500 bg-primary-50 dark:bg-primary-900/20'
-                    : 'border-gray-200'
-                "
-              >
-                <input
-                  type="checkbox"
-                  :value="model.value"
-                  v-model="allowedModels"
-                  class="mr-2 rounded border-gray-300 text-primary-600 focus:ring-primary-500"
-                />
-                <span class="text-sm text-gray-700 dark:text-gray-300">{{ model.label }}</span>
-              </label>
-            </div>
-
+            <ModelWhitelistSelector v-model="allowedModels" :platform="account?.platform || 'anthropic'" />
             <p class="text-xs text-gray-500 dark:text-gray-400">
               {{ t('admin.accounts.selectedModels', { count: allowedModels.length }) }}
               <span v-if="allowedModels.length === 0">{{
@@ -565,6 +525,12 @@ import BaseDialog from '@/components/common/BaseDialog.vue'
 import Select from '@/components/common/Select.vue'
 import ProxySelector from '@/components/common/ProxySelector.vue'
 import GroupSelector from '@/components/common/GroupSelector.vue'
+import ModelWhitelistSelector from '@/components/account/ModelWhitelistSelector.vue'
+import {
+  getPresetMappingsByPlatform,
+  commonErrorCodes,
+  buildModelMappingObject
+} from '@/composables/useModelWhitelist'
 
 interface Props {
   show: boolean
@@ -610,167 +576,8 @@ const customErrorCodeInput = ref<number | null>(null)
 const interceptWarmupRequests = ref(false)
 const mixedScheduling = ref(false) // For antigravity accounts: enable mixed scheduling
 
-// Common models for whitelist - Anthropic
-const anthropicModels = [
-  { value: 'claude-opus-4-5-20251101', label: 'Claude Opus 4.5' },
-  { value: 'claude-sonnet-4-20250514', label: 'Claude Sonnet 4' },
-  { value: 'claude-sonnet-4-5-20250929', label: 'Claude Sonnet 4.5' },
-  { value: 'claude-3-5-haiku-20241022', label: 'Claude 3.5 Haiku' },
-  { value: 'claude-haiku-4-5-20251001', label: 'Claude Haiku 4.5' },
-  { value: 'claude-3-opus-20240229', label: 'Claude 3 Opus' },
-  { value: 'claude-3-5-sonnet-20241022', label: 'Claude 3.5 Sonnet' },
-  { value: 'claude-3-haiku-20240307', label: 'Claude 3 Haiku' }
-]
-
-// Common models for whitelist - OpenAI
-const openaiModels = [
-  { value: 'gpt-5.2-2025-12-11', label: 'GPT-5.2' },
-  { value: 'gpt-5.2-codex', label: 'GPT-5.2 Codex' },
-  { value: 'gpt-5.1-codex-max', label: 'GPT-5.1 Codex Max' },
-  { value: 'gpt-5.1-codex', label: 'GPT-5.1 Codex' },
-  { value: 'gpt-5.1-2025-11-13', label: 'GPT-5.1' },
-  { value: 'gpt-5.1-codex-mini', label: 'GPT-5.1 Codex Mini' },
-  { value: 'gpt-5-2025-08-07', label: 'GPT-5' }
-]
-
-// Common models for whitelist - Gemini
-const geminiModels = [
-  { value: 'gemini-2.0-flash', label: 'Gemini 2.0 Flash' },
-  { value: 'gemini-2.0-flash-lite', label: 'Gemini 2.0 Flash Lite' },
-  { value: 'gemini-1.5-pro', label: 'Gemini 1.5 Pro' },
-  { value: 'gemini-1.5-flash', label: 'Gemini 1.5 Flash' }
-]
-
-// Computed: current models based on platform
-const commonModels = computed(() => {
-  if (props.account?.platform === 'openai') return openaiModels
-  if (props.account?.platform === 'gemini') return geminiModels
-  return anthropicModels
-})
-
-// Preset mappings for quick add - Anthropic
-const anthropicPresetMappings = [
-  {
-    label: 'Sonnet 4',
-    from: 'claude-sonnet-4-20250514',
-    to: 'claude-sonnet-4-20250514',
-    color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400'
-  },
-  {
-    label: 'Sonnet 4.5',
-    from: 'claude-sonnet-4-5-20250929',
-    to: 'claude-sonnet-4-5-20250929',
-    color:
-      'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400'
-  },
-  {
-    label: 'Opus 4.5',
-    from: 'claude-opus-4-5-20251101',
-    to: 'claude-opus-4-5-20251101',
-    color:
-      'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400'
-  },
-  {
-    label: 'Haiku 3.5',
-    from: 'claude-3-5-haiku-20241022',
-    to: 'claude-3-5-haiku-20241022',
-    color: 'bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-400'
-  },
-  {
-    label: 'Haiku 4.5',
-    from: 'claude-haiku-4-5-20251001',
-    to: 'claude-haiku-4-5-20251001',
-    color:
-      'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400'
-  },
-  {
-    label: 'Opus->Sonnet',
-    from: 'claude-opus-4-5-20251101',
-    to: 'claude-sonnet-4-5-20250929',
-    color: 'bg-amber-100 text-amber-700 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-400'
-  }
-]
-
-// Preset mappings for quick add - OpenAI
-const openaiPresetMappings = [
-  {
-    label: 'GPT-5.2',
-    from: 'gpt-5.2-2025-12-11',
-    to: 'gpt-5.2-2025-12-11',
-    color: 'bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-400'
-  },
-  {
-    label: 'GPT-5.2 Codex',
-    from: 'gpt-5.2-codex',
-    to: 'gpt-5.2-codex',
-    color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400'
-  },
-  {
-    label: 'GPT-5.1 Codex',
-    from: 'gpt-5.1-codex',
-    to: 'gpt-5.1-codex',
-    color:
-      'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400'
-  },
-  {
-    label: 'Codex Max',
-    from: 'gpt-5.1-codex-max',
-    to: 'gpt-5.1-codex-max',
-    color:
-      'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400'
-  },
-  {
-    label: 'Codex Mini',
-    from: 'gpt-5.1-codex-mini',
-    to: 'gpt-5.1-codex-mini',
-    color:
-      'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400'
-  },
-  {
-    label: 'Max->Codex',
-    from: 'gpt-5.1-codex-max',
-    to: 'gpt-5.1-codex',
-    color: 'bg-amber-100 text-amber-700 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-400'
-  }
-]
-
-// Preset mappings for quick add - Gemini
-const geminiPresetMappings = [
-  {
-    label: 'Flash',
-    from: 'gemini-2.0-flash',
-    to: 'gemini-2.0-flash',
-    color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400'
-  },
-  {
-    label: 'Flash Lite',
-    from: 'gemini-2.0-flash-lite',
-    to: 'gemini-2.0-flash-lite',
-    color:
-      'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400'
-  },
-  {
-    label: '1.5 Pro',
-    from: 'gemini-1.5-pro',
-    to: 'gemini-1.5-pro',
-    color:
-      'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400'
-  },
-  {
-    label: '1.5 Flash',
-    from: 'gemini-1.5-flash',
-    to: 'gemini-1.5-flash',
-    color:
-      'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400'
-  }
-]
-
 // Computed: current preset mappings based on platform
-const presetMappings = computed(() => {
-  if (props.account?.platform === 'openai') return openaiPresetMappings
-  if (props.account?.platform === 'gemini') return geminiPresetMappings
-  return anthropicPresetMappings
-})
+const presetMappings = computed(() => getPresetMappingsByPlatform(props.account?.platform || 'anthropic'))
 
 // Computed: default base URL based on platform
 const defaultBaseUrl = computed(() => {
@@ -779,17 +586,6 @@ const defaultBaseUrl = computed(() => {
   return 'https://api.anthropic.com'
 })
 
-// Common HTTP error codes for quick selection
-const commonErrorCodes = [
-  { value: 401, label: 'Unauthorized' },
-  { value: 403, label: 'Forbidden' },
-  { value: 429, label: 'Rate Limit' },
-  { value: 500, label: 'Server Error' },
-  { value: 502, label: 'Bad Gateway' },
-  { value: 503, label: 'Unavailable' },
-  { value: 529, label: 'Overloaded' }
-]
-
 const form = reactive({
   name: '',
   proxy_id: null as number | null,
@@ -940,28 +736,6 @@ const removeErrorCode = (code: number) => {
   }
 }
 
-const buildModelMappingObject = (): Record<string, string> | null => {
-  const mapping: Record<string, string> = {}
-
-  if (modelRestrictionMode.value === 'whitelist') {
-    // Whitelist mode: model maps to itself
-    for (const model of allowedModels.value) {
-      mapping[model] = model
-    }
-  } else {
-    // Mapping mode: use the mapping entries
-    for (const m of modelMappings.value) {
-      const from = m.from.trim()
-      const to = m.to.trim()
-      if (from && to) {
-        mapping[from] = to
-      }
-    }
-  }
-
-  return Object.keys(mapping).length > 0 ? mapping : null
-}
-
 // Methods
 const handleClose = () => {
   emit('close')
@@ -978,7 +752,7 @@ const handleSubmit = async () => {
     if (props.account.type === 'apikey') {
       const currentCredentials = (props.account.credentials as Record<string, unknown>) || {}
       const newBaseUrl = editBaseUrl.value.trim() || defaultBaseUrl.value
-      const modelMapping = buildModelMappingObject()
+      const modelMapping = buildModelMappingObject(modelRestrictionMode.value, allowedModels.value, modelMappings.value)
 
       // Always update credentials for apikey type to handle model mapping changes
       const newCredentials: Record<string, unknown> = {

frontend/src/components/account/ModelWhitelistSelector.vue

@@ -0,0 +1,201 @@
+<template>
+  <div>
+    <!-- Multi-select Dropdown -->
+    <div class="relative mb-3">
+      <div
+        @click="toggleDropdown"
+        class="cursor-pointer rounded-lg border border-gray-300 bg-white px-3 py-2 dark:border-dark-500 dark:bg-dark-700"
+      >
+        <div class="grid grid-cols-2 gap-1.5">
+          <span
+            v-for="model in modelValue"
+            :key="model"
+            class="inline-flex items-center justify-between gap-1 rounded bg-gray-100 px-2 py-1 text-xs text-gray-700 dark:bg-dark-600 dark:text-gray-300"
+          >
+            <span class="flex items-center gap-1 truncate">
+              <ModelIcon :model="model" size="14px" />
+              <span class="truncate">{{ model }}</span>
+            </span>
+            <button
+              type="button"
+              @click.stop="removeModel(model)"
+              class="shrink-0 rounded-full hover:bg-gray-200 dark:hover:bg-dark-500"
+            >
+              <svg class="h-3.5 w-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+              </svg>
+            </button>
+          </span>
+        </div>
+        <div class="mt-2 flex items-center justify-between border-t border-gray-200 pt-2 dark:border-dark-600">
+          <span class="text-xs text-gray-400">{{ t('admin.accounts.modelCount', { count: modelValue.length }) }}</span>
+          <svg class="h-5 w-5 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+          </svg>
+        </div>
+      </div>
+      <!-- Dropdown List -->
+      <div
+        v-if="showDropdown"
+        class="absolute left-0 right-0 top-full z-50 mt-1 rounded-lg border border-gray-200 bg-white shadow-lg dark:border-dark-600 dark:bg-dark-700"
+      >
+        <div class="sticky top-0 border-b border-gray-200 bg-white p-2 dark:border-dark-600 dark:bg-dark-700">
+          <input
+            v-model="searchQuery"
+            type="text"
+            class="input w-full text-sm"
+            :placeholder="t('admin.accounts.searchModels')"
+            @click.stop
+          />
+        </div>
+        <div class="max-h-52 overflow-auto">
+          <button
+            v-for="model in filteredModels"
+            :key="model.value"
+            type="button"
+            @click="toggleModel(model.value)"
+            class="flex w-full items-center gap-2 px-3 py-2 text-left text-sm hover:bg-gray-100 dark:hover:bg-dark-600"
+          >
+            <span
+              :class="[
+                'flex h-4 w-4 shrink-0 items-center justify-center rounded border',
+                modelValue.includes(model.value)
+                  ? 'border-primary-500 bg-primary-500 text-white'
+                  : 'border-gray-300 dark:border-dark-500'
+              ]"
+            >
+              <svg v-if="modelValue.includes(model.value)" class="h-3 w-3" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7" />
+              </svg>
+            </span>
+            <ModelIcon :model="model.value" size="18px" />
+            <span class="truncate text-gray-900 dark:text-white">{{ model.value }}</span>
+          </button>
+          <div v-if="filteredModels.length === 0" class="px-3 py-4 text-center text-sm text-gray-500">
+            {{ t('admin.accounts.noMatchingModels') }}
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Quick Actions -->
+    <div class="mb-4 flex flex-wrap gap-2">
+      <button
+        type="button"
+        @click="fillRelated"
+        class="rounded-lg border border-blue-200 px-3 py-1.5 text-sm text-blue-600 hover:bg-blue-50 dark:border-blue-800 dark:text-blue-400 dark:hover:bg-blue-900/30"
+      >
+        {{ t('admin.accounts.fillRelatedModels') }}
+      </button>
+      <button
+        type="button"
+        @click="clearAll"
+        class="rounded-lg border border-red-200 px-3 py-1.5 text-sm text-red-600 hover:bg-red-50 dark:border-red-800 dark:text-red-400 dark:hover:bg-red-900/30"
+      >
+        {{ t('admin.accounts.clearAllModels') }}
+      </button>
+    </div>
+
+    <!-- Custom Model Input -->
+    <div class="mb-3">
+      <label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-300">{{ t('admin.accounts.customModelName') }}</label>
+      <div class="flex gap-2">
+        <input
+          v-model="customModel"
+          type="text"
+          class="input flex-1"
+          :placeholder="t('admin.accounts.enterCustomModelName')"
+          @keydown.enter.prevent="handleEnter"
+          @compositionstart="isComposing = true"
+          @compositionend="isComposing = false"
+        />
+        <button
+          type="button"
+          @click="addCustom"
+          class="rounded-lg bg-primary-50 px-4 py-2 text-sm font-medium text-primary-600 hover:bg-primary-100 dark:bg-primary-900/30 dark:text-primary-400 dark:hover:bg-primary-900/50"
+        >
+          {{ t('admin.accounts.addModel') }}
+        </button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useAppStore } from '@/stores/app'
+import ModelIcon from '@/components/common/ModelIcon.vue'
+import { allModels, getModelsByPlatform } from '@/composables/useModelWhitelist'
+
+const { t } = useI18n()
+
+const props = defineProps<{
+  modelValue: string[]
+  platform: string
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: string[]]
+}>()
+
+const appStore = useAppStore()
+
+const showDropdown = ref(false)
+const searchQuery = ref('')
+const customModel = ref('')
+const isComposing = ref(false)
+
+const filteredModels = computed(() => {
+  const query = searchQuery.value.toLowerCase().trim()
+  if (!query) return allModels
+  return allModels.filter(
+    m => m.value.toLowerCase().includes(query) || m.label.toLowerCase().includes(query)
+  )
+})
+
+const toggleDropdown = () => {
+  showDropdown.value = !showDropdown.value
+  if (!showDropdown.value) searchQuery.value = ''
+}
+
+const removeModel = (model: string) => {
+  emit('update:modelValue', props.modelValue.filter(m => m !== model))
+}
+
+const toggleModel = (model: string) => {
+  if (props.modelValue.includes(model)) {
+    removeModel(model)
+  } else {
+    emit('update:modelValue', [...props.modelValue, model])
+  }
+}
+
+const addCustom = () => {
+  const model = customModel.value.trim()
+  if (!model) return
+  if (props.modelValue.includes(model)) {
+    appStore.showInfo(t('admin.accounts.modelExists'))
+    return
+  }
+  emit('update:modelValue', [...props.modelValue, model])
+  customModel.value = ''
+}
+
+const handleEnter = () => {
+  if (!isComposing.value) addCustom()
+}
+
+const fillRelated = () => {
+  const models = getModelsByPlatform(props.platform)
+  const newModels = [...props.modelValue]
+  for (const model of models) {
+    if (!newModels.includes(model)) newModels.push(model)
+  }
+  emit('update:modelValue', newModels)
+}
+
+const clearAll = () => {
+  emit('update:modelValue', [])
+}
+</script>

frontend/src/components/account/ReAuthAccountModal.vue

@@ -121,16 +121,13 @@
                 />
               </svg>
             </div>
-            <div>
-              <span class="block text-sm font-medium text-gray-900 dark:text-white">{{
-                t('admin.accounts.types.codeAssist')
-              }}</span>
-              <span class="block text-xs font-medium text-blue-600 dark:text-blue-400">{{
-                t('admin.accounts.oauth.gemini.needsProjectId')
-              }}</span>
-              <span class="text-xs text-gray-500 dark:text-gray-400">{{
-                t('admin.accounts.oauth.gemini.needsProjectIdDesc')
-              }}</span>
+            <div class="min-w-0">
+              <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                {{ t('admin.accounts.gemini.oauthType.builtInTitle') }}
+              </span>
+              <span class="text-xs text-gray-500 dark:text-gray-400">
+                {{ t('admin.accounts.gemini.oauthType.builtInDesc') }}
+              </span>
             </div>
           </button>
 
@@ -168,14 +165,13 @@
                 />
               </svg>
             </div>
-            <div>
-              <span class="block text-sm font-medium text-gray-900 dark:text-white">AI Studio</span>
-              <span class="block text-xs font-medium text-purple-600 dark:text-purple-400">{{
-                t('admin.accounts.oauth.gemini.noProjectIdNeeded')
-              }}</span>
-              <span class="text-xs text-gray-500 dark:text-gray-400">{{
-                t('admin.accounts.oauth.gemini.noProjectIdNeededDesc')
-              }}</span>
+            <div class="min-w-0">
+              <span class="block text-sm font-medium text-gray-900 dark:text-white">
+                {{ t('admin.accounts.gemini.oauthType.customTitle') }}
+              </span>
+              <span class="text-xs text-gray-500 dark:text-gray-400">
+                {{ t('admin.accounts.gemini.oauthType.customDesc') }}
+              </span>
               <div v-if="!geminiAIStudioOAuthEnabled" class="group relative mt-1 inline-block">
                 <span
                   class="rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-700 dark:bg-amber-900/30 dark:text-amber-300"

frontend/src/components/account/UsageProgressBar.vue

@@ -4,7 +4,7 @@
     <div
       v-if="windowStats"
       class="mb-0.5 flex items-center justify-between"
-      :title="t('admin.accounts.usageWindow.statsTitle')"
+      :title="statsTitle || t('admin.accounts.usageWindow.statsTitle')"
     >
       <div
         class="flex cursor-help items-center gap-1.5 text-[9px] text-gray-500 dark:text-gray-400"
@@ -60,6 +60,7 @@ const props = defineProps<{
   resetsAt?: string | null
   color: 'indigo' | 'emerald' | 'purple' | 'amber'
   windowStats?: WindowStats | null
+  statsTitle?: string
 }>()
 
 const { t } = useI18n()

frontend/src/components/common/ModelIcon.vue

@@ -0,0 +1,278 @@
+<template>
+  <svg
+    v-if="iconInfo"
+    :width="size"
+    :height="size"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    class="model-icon"
+    fill="currentColor"
+    fill-rule="evenodd"
+  >
+    <path v-for="(p, idx) in iconInfo.paths" :key="idx" :d="p" :fill="iconInfo.color" />
+  </svg>
+  <span v-else class="model-icon-fallback" :style="{ width: size, height: size, fontSize: `calc(${size} * 0.5)` }">
+    {{ fallbackText }}
+  </span>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+
+const props = withDefaults(defineProps<{
+  model: string
+  size?: string
+}>(), {
+  size: '18px'
+})
+
+interface IconData {
+  color: string
+  paths: string[]
+}
+
+// SVG paths extracted from @lobehub/icons Mono.js files
+const iconData: Record<string, IconData> = {
+  claude: {
+    color: '#D97706',
+    paths: ['M4.709 15.955l4.72-2.647.08-.23-.08-.128H9.2l-.79-.048-2.698-.073-2.339-.097-2.266-.122-.571-.121L0 11.784l.055-.352.48-.321.686.06 1.52.103 2.278.158 1.652.097 2.449.255h.389l.055-.157-.134-.098-.103-.097-2.358-1.596-2.552-1.688-1.336-.972-.724-.491-.364-.462-.158-1.008.656-.722.881.06.225.061.893.686 1.908 1.476 2.491 1.833.365.304.145-.103.019-.073-.164-.274-1.355-2.446-1.446-2.49-.644-1.032-.17-.619a2.97 2.97 0 01-.104-.729L6.283.134 6.696 0l.996.134.42.364.62 1.414 1.002 2.229 1.555 3.03.456.898.243.832.091.255h.158V9.01l.128-1.706.237-2.095.23-2.695.08-.76.376-.91.747-.492.584.28.48.685-.067.444-.286 1.851-.559 2.903-.364 1.942h.212l.243-.242.985-1.306 1.652-2.064.73-.82.85-.904.547-.431h1.033l.76 1.129-.34 1.166-1.064 1.347-.881 1.142-1.264 1.7-.79 1.36.073.11.188-.02 2.856-.606 1.543-.28 1.841-.315.833.388.091.395-.328.807-1.969.486-2.309.462-3.439.813-.042.03.049.061 1.549.146.662.036h1.622l3.02.225.79.522.474.638-.079.485-1.215.62-1.64-.389-3.829-.91-1.312-.329h-.182v.11l1.093 1.068 2.006 1.81 2.509 2.33.127.578-.322.455-.34-.049-2.205-1.657-.851-.747-1.926-1.62h-.128v.17l.444.649 2.345 3.521.122 1.08-.17.353-.608.213-.668-.122-1.374-1.925-1.415-2.167-1.143-1.943-.14.08-.674 7.254-.316.37-.729.28-.607-.461-.322-.747.322-1.476.389-1.924.315-1.53.286-1.9.17-.632-.012-.042-.14.018-1.434 1.967-2.18 2.945-1.726 1.845-.414.164-.717-.37.067-.662.401-.589 2.388-3.036 1.44-1.882.93-1.086-.006-.158h-.055L4.132 18.56l-1.13.146-.487-.456.061-.746.231-.243 1.908-1.312-.006.006z']
+  },
+  openai: {
+    color: '#000000',
+    paths: ['M21.55 10.004a5.416 5.416 0 00-.478-4.501c-1.217-2.09-3.662-3.166-6.05-2.66A5.59 5.59 0 0010.831 1C8.39.995 6.224 2.546 5.473 4.838A5.553 5.553 0 001.76 7.496a5.487 5.487 0 00.691 6.5 5.416 5.416 0 00.477 4.502c1.217 2.09 3.662 3.165 6.05 2.66A5.586 5.586 0 0013.168 23c2.443.006 4.61-1.546 5.361-3.84a5.553 5.553 0 003.715-2.66 5.488 5.488 0 00-.693-6.497v.001zm-8.381 11.558a4.199 4.199 0 01-2.675-.954c.034-.018.093-.05.132-.074l4.44-2.53a.71.71 0 00.364-.623v-6.176l1.877 1.069c.02.01.033.029.036.05v5.115c-.003 2.274-1.87 4.118-4.174 4.123zM4.192 17.78a4.059 4.059 0 01-.498-2.763c.032.02.09.055.131.078l4.44 2.53c.225.13.504.13.73 0l5.42-3.088v2.138a.068.068 0 01-.027.057L9.9 19.288c-1.999 1.136-4.552.46-5.707-1.51h-.001zM3.023 8.216A4.15 4.15 0 015.198 6.41l-.002.151v5.06a.711.711 0 00.364.624l5.42 3.087-1.876 1.07a.067.067 0 01-.063.005l-4.489-2.559c-1.995-1.14-2.679-3.658-1.53-5.63h.001zm15.417 3.54l-5.42-3.088L14.896 7.6a.067.067 0 01.063-.006l4.489 2.557c1.998 1.14 2.683 3.662 1.529 5.633a4.163 4.163 0 01-2.174 1.807V12.38a.71.71 0 00-.363-.623zm1.867-2.773a6.04 6.04 0 00-.132-.078l-4.44-2.53a.731.731 0 00-.729 0l-5.42 3.088V7.325a.068.068 0 01.027-.057L14.1 4.713c2-1.137 4.555-.46 5.707 1.513.487.833.664 1.809.499 2.757h.001zm-11.741 3.81l-1.877-1.068a.065.065 0 01-.036-.051V6.559c.001-2.277 1.873-4.122 4.181-4.12.976 0 1.92.338 2.671.954-.034.018-.092.05-.131.073l-4.44 2.53a.71.71 0 00-.365.623l-.003 6.173v.002zm1.02-2.168L12 9.25l2.414 1.375v2.75L12 14.75l-2.415-1.375v-2.75z']
+  },
+  gemini: {
+    color: '#4285F4',
+    paths: ['M20.616 10.835a14.147 14.147 0 01-4.45-3.001 14.111 14.111 0 01-3.678-6.452.503.503 0 00-.975 0 14.134 14.134 0 01-3.679 6.452 14.155 14.155 0 01-4.45 3.001c-.65.28-1.318.505-2.002.678a.502.502 0 000 .975c.684.172 1.35.397 2.002.677a14.147 14.147 0 014.45 3.001 14.112 14.112 0 013.679 6.453.502.502 0 00.975 0c.172-.685.397-1.351.677-2.003a14.145 14.145 0 013.001-4.45 14.113 14.113 0 016.453-3.678.503.503 0 000-.975 13.245 13.245 0 01-2.003-.678z']
+  },
+  zhipu: {
+    color: '#3859FF',
+    paths: ['M11.991 23.503a.24.24 0 00-.244.248.24.24 0 00.244.249.24.24 0 00.245-.249.24.24 0 00-.22-.247l-.025-.001zM9.671 5.365a1.697 1.697 0 011.099 2.132l-.071.172-.016.04-.018.054c-.07.16-.104.32-.104.498-.035.71.47 1.279 1.186 1.314h.366c1.309.053 2.338 1.173 2.286 2.523-.052 1.332-1.152 2.38-2.478 2.327h-.174c-.715.018-1.274.64-1.239 1.368 0 .124.018.23.053.337.209.373.54.658.96.8.75.23 1.517-.125 1.9-.782l.018-.035c.402-.64 1.17-.96 1.92-.711.854.284 1.378 1.226 1.099 2.167a1.661 1.661 0 01-2.077 1.102 1.711 1.711 0 01-.907-.711l-.017-.035c-.2-.323-.463-.58-.851-.711l-.056-.018a1.646 1.646 0 00-1.954.746 1.66 1.66 0 01-1.065.764 1.677 1.677 0 01-1.989-1.279c-.209-.906.332-1.83 1.257-2.043a1.51 1.51 0 01.296-.035h.018c.68-.071 1.151-.622 1.116-1.333a1.307 1.307 0 00-.227-.693 2.515 2.515 0 01-.366-1.403 2.39 2.39 0 01.366-1.208c.14-.195.21-.444.227-.693.018-.71-.506-1.261-1.186-1.332l-.07-.018a1.43 1.43 0 01-.299-.07l-.05-.019a1.7 1.7 0 01-1.047-2.114 1.68 1.68 0 012.094-1.101zm-5.575 10.11c.26-.264.639-.367.994-.27.355.096.633.379.728.74.095.362-.007.748-.267 1.013-.402.41-1.053.41-1.455 0a1.062 1.062 0 010-1.482zm14.845-.294c.359-.09.738.024.992.297.254.274.344.665.237 1.025-.107.36-.396.634-.756.718-.551.128-1.1-.22-1.23-.781a1.05 1.05 0 01.757-1.26zm-.064-4.39c.314.32.49.753.49 1.206 0 .452-.176.886-.49 1.206-.315.32-.74.5-1.185.5-.444 0-.87-.18-1.184-.5a1.727 1.727 0 010-2.412 1.654 1.654 0 012.369 0zm-11.243.163c.364.484.447 1.128.218 1.691a1.665 1.665 0 01-2.188.923c-.855-.36-1.26-1.358-.907-2.228a1.68 1.68 0 011.33-1.038c.593-.08 1.183.169 1.547.652zm11.545-4.221c.368 0 .708.2.892.524.184.324.184.724 0 1.048a1.026 1.026 0 01-.892.524c-.568 0-1.03-.47-1.03-1.048 0-.579.462-1.048 1.03-1.048zm-14.358 0c.368 0 .707.2.891.524.184.324.184.724 0 1.048a1.026 1.026 0 01-.891.524c-.569 0-1.03-.47-1.03-1.048 0-.579.461-1.048 1.03-1.048zm10.031-1.475c.925 0 1.675.764 1.675 1.706s-.75 1.705-1.675 1.705-1.674-.763-1.674-1.705c0-.942.75-1.706 1.674-1.706zm-2.626-.684c.362-.082.653-.356.761-.718a1.062 1.062 0 00-.238-1.028 1.017 1.017 0 00-.996-.294c-.547.14-.881.7-.752 1.257.13.558.675.907 1.225.783zm0 16.876c.359-.087.644-.36.75-.72a1.062 1.062 0 00-.237-1.019 1.018 1.018 0 00-.985-.301 1.037 1.037 0 00-.762.717c-.108.361-.017.754.239 1.028.245.263.606.377.953.305l.043-.01zM17.19 3.5a.631.631 0 00.628-.64c0-.355-.279-.64-.628-.64a.631.631 0 00-.628.64c0 .355.28.64.628.64zm-10.38 0a.631.631 0 00.628-.64c0-.355-.28-.64-.628-.64a.631.631 0 00-.628.64c0 .355.279.64.628.64zm-5.182 7.852a.631.631 0 00-.628.64c0 .354.28.639.628.639a.63.63 0 00.627-.606l.001-.034a.62.62 0 00-.628-.64zm5.182 9.13a.631.631 0 00-.628.64c0 .355.279.64.628.64a.631.631 0 00.628-.64c0-.355-.28-.64-.628-.64zm10.38.018a.631.631 0 00-.628.64c0 .355.28.64.628.64a.631.631 0 00.628-.64c0-.355-.279-.64-.628-.64zm5.182-9.148a.631.631 0 00-.628.64c0 .354.279.639.628.639a.631.631 0 00.628-.64c0-.355-.28-.64-.628-.64zm-.384-4.992a.24.24 0 00.244-.249.24.24 0 00-.244-.249.24.24 0 00-.244.249c0 .142.122.249.244.249zM11.991.497a.24.24 0 00.245-.248A.24.24 0 0011.99 0a.24.24 0 00-.244.249c0 .133.108.236.223.247l.021.001zM2.011 6.36a.24.24 0 00.245-.249.24.24 0 00-.244-.249.24.24 0 00-.244.249.24.24 0 00.244.249zm0 11.263a.24.24 0 00-.243.248.24.24 0 00.244.249.24.24 0 00.244-.249.252.252 0 00-.244-.248zm19.995-.018a.24.24 0 00-.245.248.24.24 0 00.245.25.24.24 0 00.244-.25.252.252 0 00-.244-.248z']
+  },
+  qwen: {
+    color: '#615EFF',
+    paths: ['M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z']
+  },
+  deepseek: {
+    color: '#4D6BFE',
+    paths: ['M23.748 4.482c-.254-.124-.364.113-.512.234-.051.039-.094.09-.137.136-.372.397-.806.657-1.373.626-.829-.046-1.537.214-2.163.848-.133-.782-.575-1.248-1.247-1.548-.352-.156-.708-.311-.955-.65-.172-.241-.219-.51-.305-.774-.055-.16-.11-.323-.293-.35-.2-.031-.278.136-.356.276-.313.572-.434 1.202-.422 1.84.027 1.436.633 2.58 1.838 3.393.137.093.172.187.129.323-.082.28-.18.552-.266.833-.055.179-.137.217-.329.14a5.526 5.526 0 01-1.736-1.18c-.857-.828-1.631-1.742-2.597-2.458a11.365 11.365 0 00-.689-.471c-.985-.957.13-1.743.388-1.836.27-.098.093-.432-.779-.428-.872.004-1.67.295-2.687.684a3.055 3.055 0 01-.465.137 9.597 9.597 0 00-2.883-.102c-1.885.21-3.39 1.102-4.497 2.623C.082 8.606-.231 10.684.152 12.85c.403 2.284 1.569 4.175 3.36 5.653 1.858 1.533 3.997 2.284 6.438 2.14 1.482-.085 3.133-.284 4.994-1.86.47.234.962.327 1.78.397.63.059 1.236-.03 1.705-.128.735-.156.684-.837.419-.961-2.155-1.004-1.682-.595-2.113-.926 1.096-1.296 2.746-2.642 3.392-7.003.05-.347.007-.565 0-.845-.004-.17.035-.237.23-.256a4.173 4.173 0 001.545-.475c1.396-.763 1.96-2.015 2.093-3.517.02-.23-.004-.467-.247-.588zM11.581 18c-2.089-1.642-3.102-2.183-3.52-2.16-.392.024-.321.471-.235.763.09.288.207.486.371.739.114.167.192.416-.113.603-.673.416-1.842-.14-1.897-.167-1.361-.802-2.5-1.86-3.301-3.307-.774-1.393-1.224-2.887-1.298-4.482-.02-.386.093-.522.477-.592a4.696 4.696 0 011.529-.039c2.132.312 3.946 1.265 5.468 2.774.868.86 1.525 1.887 2.202 2.891.72 1.066 1.494 2.082 2.48 2.914.348.292.625.514.891.677-.802.09-2.14.11-3.054-.614zm1-6.44a.306.306 0 01.415-.287.302.302 0 01.2.288.306.306 0 01-.31.307.303.303 0 01-.304-.308zm3.11 1.596c-.2.081-.399.151-.59.16a1.245 1.245 0 01-.798-.254c-.274-.23-.47-.358-.552-.758a1.73 1.73 0 01.016-.588c.07-.327-.008-.537-.239-.727-.187-.156-.426-.199-.688-.199a.559.559 0 01-.254-.078c-.11-.054-.2-.19-.114-.358.028-.054.16-.186.192-.21.356-.202.767-.136 1.146.016.352.144.618.408 1.001.782.391.451.462.576.685.914.176.265.336.537.445.848.067.195-.019.354-.25.452z']
+  },
+  mistral: {
+    color: '#F7D046',
+    paths: ['M3.428 3.4h3.429v3.428h3.429v3.429h-.002 3.431V6.828h3.427V3.4h3.43v13.714H24v3.429H13.714v-3.428h-3.428v-3.429h-3.43v3.428h3.43v3.429H0v-3.429h3.428V3.4zm10.286 13.715h3.428v-3.429h-3.427v3.429z']
+  },
+  meta: {
+    color: '#0668E1',
+    paths: ['M6.897 4c1.915 0 3.516.932 5.43 3.376l.282-.373c.19-.246.383-.484.58-.71l.313-.35C14.588 4.788 15.792 4 17.225 4c1.273 0 2.469.557 3.491 1.516l.218.213c1.73 1.765 2.917 4.71 3.053 8.026l.011.392.002.25c0 1.501-.28 2.759-.818 3.7l-.14.23-.108.153c-.301.42-.664.758-1.086 1.009l-.265.142-.087.04a3.493 3.493 0 01-.302.118 4.117 4.117 0 01-1.33.208c-.524 0-.996-.067-1.438-.215-.614-.204-1.163-.56-1.726-1.116l-.227-.235c-.753-.812-1.534-1.976-2.493-3.586l-1.43-2.41-.544-.895-1.766 3.13-.343.592C7.597 19.156 6.227 20 4.356 20c-1.21 0-2.205-.42-2.936-1.182l-.168-.184c-.484-.573-.837-1.311-1.043-2.189l-.067-.32a8.69 8.69 0 01-.136-1.288L0 14.468c.002-.745.06-1.49.174-2.23l.1-.573c.298-1.53.828-2.958 1.536-4.157l.209-.34c1.177-1.83 2.789-3.053 4.615-3.16L6.897 4zm-.033 2.615l-.201.01c-.83.083-1.606.673-2.252 1.577l-.138.199-.01.018c-.67 1.017-1.185 2.378-1.456 3.845l-.004.022a12.591 12.591 0 00-.207 2.254l.002.188c.004.18.017.36.04.54l.043.291c.092.503.257.908.486 1.208l.117.137c.303.323.698.492 1.17.492 1.1 0 1.796-.676 3.696-3.641l2.175-3.4.454-.701-.139-.198C9.11 7.3 8.084 6.616 6.864 6.616zm10.196-.552l-.176.007c-.635.048-1.223.359-1.82.933l-.196.198c-.439.462-.887 1.064-1.367 1.807l.266.398c.18.274.362.56.55.858l.293.475 1.396 2.335.695 1.114c.583.926 1.03 1.6 1.408 2.082l.213.262c.282.326.529.54.777.673l.102.05c.227.1.457.138.718.138.176.002.35-.023.518-.073.338-.104.61-.32.813-.637l.095-.163.077-.162c.194-.459.29-1.06.29-1.785l-.006-.449c-.08-2.871-.938-5.372-2.2-6.798l-.176-.189c-.67-.683-1.444-1.074-2.27-1.074z']
+  },
+  cohere: {
+    color: '#39594D',
+    paths: [
+      'M8.128 14.099c.592 0 1.77-.033 3.398-.703 1.897-.781 5.672-2.2 8.395-3.656 1.905-1.018 2.74-2.366 2.74-4.18A4.56 4.56 0 0018.1 1H7.549A6.55 6.55 0 001 7.55c0 3.617 2.745 6.549 7.128 6.549z',
+      'M9.912 18.61a4.387 4.387 0 012.705-4.052l3.323-1.38c3.361-1.394 7.06 1.076 7.06 4.715a5.104 5.104 0 01-5.105 5.104l-3.597-.001a4.386 4.386 0 01-4.386-4.387z',
+      'M4.776 14.962A3.775 3.775 0 001 18.738v.489a3.776 3.776 0 007.551 0v-.49a3.775 3.775 0 00-3.775-3.775z'
+    ]
+  },
+  yi: {
+    color: '#003425',
+    paths: ['M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5']
+  },
+  xai: {
+    color: '#000000',
+    paths: ['M9.27 15.29l7.978-5.897c.391-.29.95-.177 1.137.272.98 2.369.542 5.215-1.41 7.169-1.951 1.954-4.667 2.382-7.149 1.406l-2.711 1.257c3.889 2.661 8.611 2.003 11.562-.953 2.341-2.344 3.066-5.539 2.388-8.42l.006.007c-.983-4.232.242-5.924 2.75-9.383.06-.082.12-.164.179-.248l-3.301 3.305v-.01L9.267 15.292M7.623 16.723c-2.792-2.67-2.31-6.801.071-9.184 1.761-1.763 4.647-2.483 7.166-1.425l2.705-1.25a7.808 7.808 0 00-1.829-1A8.975 8.975 0 005.984 5.83c-2.533 2.536-3.33 6.436-1.962 9.764 1.022 2.487-.653 4.246-2.34 6.022-.599.63-1.199 1.259-1.682 1.925l7.62-6.815']
+  },
+  moonshot: {
+    color: '#16191E',
+    paths: ['M1.052 16.916l9.539 2.552a21.007 21.007 0 00.06 2.033l5.956 1.593a11.997 11.997 0 01-5.586.865l-.18-.016-.044-.004-.084-.009-.094-.01a11.605 11.605 0 01-.157-.02l-.107-.014-.11-.016a11.962 11.962 0 01-.32-.051l-.042-.008-.075-.013-.107-.02-.07-.015-.093-.019-.075-.016-.095-.02-.097-.023-.094-.022-.068-.017-.088-.022-.09-.024-.095-.025-.082-.023-.109-.03-.062-.02-.084-.025-.093-.028-.105-.034-.058-.019-.08-.026-.09-.031-.066-.024a6.293 6.293 0 01-.044-.015l-.068-.025-.101-.037-.057-.022-.08-.03-.087-.035-.088-.035-.079-.032-.095-.04-.063-.028-.063-.027a5.655 5.655 0 01-.041-.018l-.066-.03-.103-.047-.052-.024-.096-.046-.062-.03-.084-.04-.086-.044-.093-.047-.052-.027-.103-.055-.057-.03-.058-.032a6.49 6.49 0 01-.046-.026l-.094-.053-.06-.034-.051-.03-.072-.041-.082-.05-.093-.056-.052-.032-.084-.053-.061-.039-.079-.05-.07-.047-.053-.035a7.785 7.785 0 01-.054-.036l-.044-.03-.044-.03a6.066 6.066 0 01-.04-.028l-.057-.04-.076-.054-.069-.05-.074-.054-.056-.042-.076-.057-.076-.059-.086-.067-.045-.035-.064-.052-.074-.06-.089-.073-.046-.039-.046-.039a7.516 7.516 0 01-.043-.037l-.045-.04-.061-.053-.07-.062-.068-.06-.062-.058-.067-.062-.053-.05-.088-.084a13.28 13.28 0 01-.099-.097l-.029-.028-.041-.042-.069-.07-.05-.051-.05-.053a6.457 6.457 0 01-.168-.179l-.08-.088-.062-.07-.071-.08-.042-.049-.053-.062-.058-.068-.046-.056a7.175 7.175 0 01-.027-.033l-.045-.055-.066-.082-.041-.052-.05-.064-.02-.025a11.99 11.99 0 01-1.44-2.402zm-1.02-5.794l11.353 3.037a20.468 20.468 0 00-.469 2.011l10.817 2.894a12.076 12.076 0 01-1.845 2.005L.657 15.923l-.016-.046-.035-.104a11.965 11.965 0 01-.05-.153l-.007-.023a11.896 11.896 0 01-.207-.741l-.03-.126-.018-.08-.021-.097-.018-.081-.018-.09-.017-.084-.018-.094c-.026-.141-.05-.283-.071-.426l-.017-.118-.011-.083-.013-.102a12.01 12.01 0 01-.019-.161l-.005-.047a12.12 12.12 0 01-.034-2.145zm1.593-5.15l11.948 3.196c-.368.605-.705 1.231-1.01 1.875l11.295 3.022c-.142.82-.368 1.612-.668 2.365l-11.55-3.09L.124 10.26l.015-.1.008-.049.01-.067.015-.087.018-.098c.026-.148.056-.295.088-.442l.028-.124.02-.085.024-.097c.022-.09.045-.18.07-.268l.028-.102.023-.083.03-.1.025-.082.03-.096.026-.082.031-.095a11.896 11.896 0 011.01-2.232zm4.442-4.4L17.352 4.59a20.77 20.77 0 00-1.688 1.721l7.823 2.093c.267.852.442 1.744.513 2.665L2.106 5.213l.045-.065.027-.04.04-.055.046-.065.055-.076.054-.072.064-.086.05-.065.057-.073.055-.07.06-.074.055-.069.065-.077.054-.066.066-.077.053-.06.072-.082.053-.06.067-.074.054-.058.073-.078.058-.06.063-.067.168-.17.1-.098.059-.056.076-.071a12.084 12.084 0 012.272-1.677zM12.017 0h.097l.082.001.069.001.054.002.068.002.046.001.076.003.047.002.06.003.054.002.087.005.105.007.144.011.088.007.044.004.077.008.082.008.047.005.102.012.05.006.108.014.081.01.042.006.065.01.207.032.07.012.065.011.14.026.092.018.11.022.046.01.075.016.041.01L14.7.3l.042.01.065.015.049.012.071.017.096.024.112.03.113.03.113.032.05.015.07.02.078.024.073.023.05.016.05.016.076.025.099.033.102.036.048.017.064.023.093.034.11.041.116.045.1.04.047.02.06.024.041.018.063.026.04.018.057.025.11.048.1.046.074.035.075.036.06.028.092.046.091.045.102.052.053.028.049.026.046.024.06.033.041.022.052.029.088.05.106.06.087.051.057.034.053.032.096.059.088.055.098.062.036.024.064.041.084.056.04.027.062.042.062.043.023.017c.054.037.108.075.161.114l.083.06.065.048.056.043.086.065.082.064.04.03.05.041.086.069.079.065.085.071c.712.6 1.353 1.283 1.909 2.031L7.222.994l.062-.027.065-.028.081-.034.086-.035c.113-.045.227-.09.341-.131l.096-.035.093-.033.084-.03.096-.031c.087-.03.176-.058.264-.085l.091-.027.086-.025.102-.03.085-.023.1-.026L9.04.37l.09-.023.091-.022.095-.022.09-.02.098-.021.091-.02.095-.018.092-.018.1-.018.091-.016.098-.017.092-.014.097-.015.092-.013.102-.013.091-.012.105-.012.09-.01.105-.01c.093-.01.186-.018.28-.024l.106-.008.09-.005.11-.006.093-.004.1-.004.097-.002.099-.002.197-.002z']
+  },
+  doubao: {
+    color: '#1C64F2',
+    paths: [
+      'M5.31 15.756c.172-3.75 1.883-5.999 2.549-6.739-3.26 2.058-5.425 5.658-6.358 8.308v1.12C1.501 21.513 4.226 24 7.59 24a6.59 6.59 0 002.2-.375c.353-.12.7-.248 1.039-.378.913-.899 1.65-1.91 2.243-2.992-4.877 2.431-7.974.072-7.763-4.5l.002.001z',
+      'M22.57 10.283c-1.212-.901-4.109-2.404-7.397-2.8.295 3.792.093 8.766-2.1 12.773a12.782 12.782 0 01-2.244 2.992c3.764-1.448 6.746-3.457 8.596-5.219 2.82-2.683 3.353-5.178 3.361-6.66a2.737 2.737 0 00-.216-1.084v-.002zM14.303 1.867C12.955.7 11.248 0 9.39 0 7.532 0 5.883.677 4.545 1.807 2.791 3.29 1.627 5.557 1.5 8.125v9.201c.932-2.65 3.097-6.25 6.357-8.307.5-.318 1.025-.595 1.569-.829 1.883-.801 3.878-.932 5.746-.706-.222-2.83-.718-5.002-.87-5.617h.001z',
+      'M17.305 4.961a199.47 199.47 0 01-1.08-1.094c-.202-.213-.398-.419-.586-.622l-1.333-1.378c.151.615.648 2.786.869 5.617 3.288.395 6.185 1.898 7.396 2.8-1.306-1.275-3.475-3.487-5.266-5.323z'
+    ]
+  },
+  minimax: {
+    color: '#F23F5D',
+    paths: ['M16.278 2c1.156 0 2.093.927 2.093 2.07v12.501a.74.74 0 00.744.709.74.74 0 00.743-.709V9.099a2.06 2.06 0 012.071-2.049A2.06 2.06 0 0124 9.1v6.561a.649.649 0 01-.652.645.649.649 0 01-.653-.645V9.1a.762.762 0 00-.766-.758.762.762 0 00-.766.758v7.472a2.037 2.037 0 01-2.048 2.026 2.037 2.037 0 01-2.048-2.026v-12.5a.785.785 0 00-.788-.753.785.785 0 00-.789.752l-.001 15.904A2.037 2.037 0 0113.441 22a2.037 2.037 0 01-2.048-2.026V18.04c0-.356.292-.645.652-.645.36 0 .652.289.652.645v1.934c0 .263.142.506.372.638.23.131.514.131.744 0a.734.734 0 00.372-.638V4.07c0-1.143.937-2.07 2.093-2.07zm-5.674 0c1.156 0 2.093.927 2.093 2.07v11.523a.648.648 0 01-.652.645.648.648 0 01-.652-.645V4.07a.785.785 0 00-.789-.78.785.785 0 00-.789.78v14.013a2.06 2.06 0 01-2.07 2.048 2.06 2.06 0 01-2.071-2.048V9.1a.762.762 0 00-.766-.758.762.762 0 00-.766.758v3.8a2.06 2.06 0 01-2.071 2.049A2.06 2.06 0 010 12.9v-1.378c0-.357.292-.646.652-.646.36 0 .653.29.653.646V12.9c0 .418.343.757.766.757s.766-.339.766-.757V9.099a2.06 2.06 0 012.07-2.048 2.06 2.06 0 012.071 2.048v8.984c0 .419.343.758.767.758.423 0 .766-.339.766-.758V4.07c0-1.143.937-2.07 2.093-2.07z']
+  },
+  wenxin: {
+    color: '#167ADF',
+    paths: ['M8.859 11.735c1.017-1.71 4.059-3.083 6.202.286 1.579 2.284 4.284 4.397 4.284 4.397s2.027 1.601.73 4.684c-1.24 2.956-5.64 1.607-6.005 1.49l-.024-.009s-1.746-.568-3.776-.112c-2.026.458-3.773.286-3.773.286l-.045-.001c-.328-.01-2.38-.187-3.001-2.968-.675-3.028 2.365-4.687 2.592-4.968.226-.288 1.802-1.37 2.816-3.085zm.986 1.738v2.032h-1.64s-1.64.138-2.213 2.014c-.2 1.252.177 1.99.242 2.148.067.157.596 1.073 1.927 1.342h3.078v-7.514l-1.394-.022zm3.588 2.191l-1.44.024v3.956s.064.985 1.44 1.344h3.541v-5.3h-1.528v3.979h-1.46s-.466-.068-.553-.447v-3.556zM9.82 16.715v3.06H8.58s-.863-.045-1.126-1.049c-.136-.445.02-.959.088-1.16.063-.203.353-.671.951-.85H9.82zm9.525-9.036c2.086 0 2.646 2.06 2.646 2.742 0 .688.284 3.597-2.309 3.655-2.595.057-2.704-1.77-2.704-3.08 0-1.374.277-3.317 2.367-3.317zM4.24 6.08c1.523-.135 2.645 1.55 2.762 2.513.07.625.393 3.486-1.975 4-2.364.515-3.244-2.249-2.984-3.544 0 0 .28-2.797 2.197-2.969zm8.847-1.483c.14-1.31 1.69-3.316 2.931-3.028 1.236.285 2.367 1.944 2.137 3.37-.224 1.428-1.345 3.313-3.095 3.082-1.748-.226-2.143-1.823-1.973-3.424zM9.425 1c1.307 0 2.364 1.519 2.364 3.398 0 1.879-1.057 3.4-2.364 3.4s-2.367-1.521-2.367-3.4C7.058 2.518 8.118 1 9.425 1z']
+  },
+  spark: {
+    color: '#0070F0',
+    paths: [
+      'M11.615 0l6.237 6.107c2.382 2.338 2.823 3.743 3.161 6.15-1.197-1.732-1.776-2.02-4.504-2.772C12.48 8.374 11.095 5.933 11.615 0z',
+      'M9.32 2.122C4.771 6.367 2 9.182 2 13.08c0 5.76 4.288 9.788 9.745 9.918 5.457.13 9.441-5.284 9.095-8.403-.347-3.118-4.418-3.81-4.418-3.81 1.69 3.16-.13 8.098-4.894 8.098-5.154 0-6.8-6.02-4.2-9.008.82 1.617 1.879 2.563 2.674 3.273.717.64 1.219 1.09 1.136 1.664-.173 1.213-1.385.866-1.385.866.346.607 3.6 1.473 4.59-1.342.613-1.741-.423-2.789-1.714-4.096-1.632-1.651-3.672-3.717-3.31-8.118z'
+    ]
+  },
+  hunyuan: {
+    color: '#0053E0',
+    paths: ['M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm1.652 1.123l-.01-.001c.533.097 1.023.233 1.41.404 6.084 2.683 7.396 9.214 1.601 14.338a3.781 3.781 0 01-5.337-.328 3.654 3.654 0 01-.884-3.044c-1.934.6-3.295 2.305-3.524 4.45-.204 1.912.324 4.044 2.056 5.634l.245.067C10.1 22.876 11.036 23 12 23c6.075 0 11-4.925 11-11 0-5.513-4.056-10.08-9.348-10.877zM2.748 6.21c-.178.269-.348.536-.51.803l-.235.394.078-.167A10.957 10.957 0 001 12c0 4.919 3.228 9.083 7.682 10.49l.214.065C3.523 18.528 2.84 14.149 6.47 8.68A2.234 2.234 0 102.748 6.21zm10.157-5.172c4.408 1.33 3.61 5.41 2.447 6.924-.86 1.117-2.922 1.46-3.708 2.238-.666.657-1.077 1.462-1.212 2.291A5.303 5.303 0 0112 12.258a5.672 5.672 0 001.404-11.169 10.51 10.51 0 00-.5-.052z']
+  },
+  cloudflare: {
+    color: '#F38020',
+    paths: [
+      'M16.493 17.4c.135-.52.08-.983-.161-1.338-.215-.328-.592-.519-1.05-.519l-8.663-.109a.148.148 0 01-.135-.082c-.027-.054-.027-.109-.027-.163.027-.082.108-.164.189-.164l8.744-.11c1.05-.054 2.153-.9 2.556-1.937l.511-1.31c.027-.055.027-.11.027-.164C17.92 8.91 15.66 7 12.942 7c-2.503 0-4.628 1.638-5.381 3.903a2.432 2.432 0 00-1.803-.491c-1.21.109-2.153 1.092-2.287 2.32-.027.328 0 .628.054.9C1.56 13.688 0 15.326 0 17.319c0 .19.027.355.027.545 0 .082.08.137.161.137h15.983c.08 0 .188-.055.215-.164l.107-.437',
+      'M19.238 11.75h-.242c-.054 0-.108.054-.135.109l-.35 1.2c-.134.52-.08.983.162 1.338.215.328.592.518 1.05.518l1.855.11c.054 0 .108.027.135.082.027.054.027.109.027.163-.027.082-.108.164-.188.164l-1.91.11c-1.05.054-2.153.9-2.557 1.937l-.134.355c-.027.055.026.137.107.137h6.592c.081 0 .162-.055.162-.137.107-.41.188-.846.188-1.31-.027-2.62-2.153-4.777-4.762-4.777'
+    ]
+  },
+  midjourney: {
+    color: '#000000',
+    paths: ['M22.369 17.676c-1.387 1.259-3.17 2.378-5.332 3.417.044.03.086.057.13.083l.018.01.019.012c.216.123.42.184.641.184.222 0 .426-.061.642-.184l.018-.011.019-.011c.14-.084.266-.178.492-.366l.178-.148c.279-.232.426-.342.625-.456.304-.174.612-.266.949-.266.337 0 .645.092.949.266l.023.014c.188.109.334.219.602.442l.178.148c.221.184.346.278.483.36l.028.017.018.01c.21.12.407.181.62.185h.022a.31.31 0 110 .618c-.337 0-.645-.092-.95-.266a3.137 3.137 0 01-.09-.054l-.022-.014-.022-.013-.02-.014a5.356 5.356 0 01-.49-.377l-.159-.132a3.836 3.836 0 00-.483-.36l-.027-.017-.019-.01a1.256 1.256 0 00-.641-.185c-.222 0-.426.061-.641.184l-.02.011-.018.011c-.14.084-.266.178-.492.366l-.158.132a5.125 5.125 0 01-.51.39l-.022.014-.022.014-.09.054a1.868 1.868 0 01-.95.266c-.337 0-.644-.092-.949-.266a3.137 3.137 0 01-.09-.054l-.022-.014-.022-.013-.026-.017a4.881 4.881 0 01-.425-.325.308.308 0 01-.12-.1l-.098-.081a3.836 3.836 0 00-.483-.36l-.027-.017-.019-.01a1.256 1.256 0 00-.641-.185c-.222 0-.426.061-.642.184l-.018.011-.019.011c-.14.084-.266.178-.492.366l-.158.132a5.125 5.125 0 01-.51.39l-.023.014-.022.014-.09.054A1.868 1.868 0 0112 22c-.337 0-.645-.092-.949-.266a3.137 3.137 0 01-.09-.054l-.022-.014-.022-.013-.021-.014a5.356 5.356 0 01-.49-.377l-.158-.132a3.836 3.836 0 00-.483-.36l-.028-.017-.018-.01a1.256 1.256 0 00-.642-.185c-.221 0-.425.061-.641.184l-.019.011-.018.011c-.141.084-.266.178-.492.366l-.158.132a5.125 5.125 0 01-.511.39l-.022.014-.022.014-.09.054a1.868 1.868 0 01-.986.264c-.746-.09-1.319-.38-1.89-.866l-.035-.03c-.047-.041-.118-.106-.192-.174l-.196-.181-.107-.1-.011-.01a1.531 1.531 0 00-.336-.253.313.313 0 00-.095-.03h-.005c-.119.022-.238.059-.361.11a.308.308 0 01-.077.061l-.008.005a.309.309 0 01-.126.034 5.66 5.66 0 00-.774.518l-.416.324-.055.043a6.542 6.542 0 01-.324.236c-.305.207-.552.315-.8.315a.31.31 0 01-.01-.618h.01c.09 0 .235-.062.438-.198l.04-.027c.077-.054.163-.117.27-.199l.385-.301.06-.047c.268-.206.506-.373.73-.505l-.633-1.21a.309.309 0 01.254-.451l20.287-1.305a.309.309 0 01.228.537zm-1.118.14L2.369 19.03l.423.809c.128-.045.256-.078.388-.1a.31.31 0 01.052-.005c.132 0 .26.032.386.093.153.073.294.179.483.35l.016.015.092.086.144.134.097.089c.065.06.125.114.16.144.485.418.948.658 1.554.736h.011a1.25 1.25 0 00.6-.172l.021-.011.019-.011.018-.011c.141-.084.266-.178.492-.366l.178-.148c.279-.232.426-.342.625-.456.305-.174.612-.266.95-.266.336 0 .644.092.948.266l.023.014c.188.109.335.219.603.442l.177.148c.222.184.346.278.484.36l.027.017.019.01c.215.124.42.185.641.185.222 0 .426-.061.641-.184l.019-.011.018-.011c.141-.084.267-.178.493-.366l.177-.148c.28-.232.427-.342.626-.456.304-.174.612-.266.949-.266.337 0 .644.092.949.266l.025.015c.187.109.334.22.603.443 1.867-.878 3.448-1.811 4.73-2.832l.02-.016zM3.653 2.026C6.073 3.06 8.69 4.941 10.8 7.258c2.46 2.7 4.109 5.828 4.637 9.149a.31.31 0 01-.421.335c-2.348-.945-4.54-1.258-6.59-1.02-1.739.2-3.337.792-4.816 1.703-.294.182-.62-.182-.405-.454 1.856-2.355 2.581-4.99 2.343-7.794-.195-2.292-1.031-4.61-2.284-6.709a.31.31 0 01.388-.442zM10.04 4.45c1.778.543 3.892 2.102 5.782 4.243 1.984 2.248 3.552 4.934 4.347 7.582a.31.31 0 01-.401.38l-.022-.01-.386-.154a10.594 10.594 0 00-.291-.112l-.016-.006c-.68-.247-1.199-.291-1.944-.101a.31.31 0 01-.375-.218C15.378 11.123 13.073 7.276 9.775 5c-.291-.201-.072-.653.266-.55zM4.273 2.996l.008.015c1.028 1.94 1.708 4.031 1.885 6.113.213 2.513-.31 4.906-1.673 7.092l-.02.031.003-.001c1.198-.581 2.47-.969 3.825-1.132l.055-.006c1.981-.23 4.083.029 6.309.837l.066.025-.007-.039c-.593-2.95-2.108-5.737-4.31-8.179l-.07-.078c-1.785-1.96-3.944-3.6-6.014-4.65l-.057-.028zm7.92 3.238l.048.048c2.237 2.295 3.885 5.431 4.974 9.191l.038.132.022-.004c.71-.133 1.284-.063 1.963.18l.027.01.066.024.046.018-.025-.073c-.811-2.307-2.208-4.62-3.936-6.594l-.058-.065c-1.02-1.155-2.103-2.132-3.15-2.856l-.015-.011z']
+  },
+  perplexity: {
+    color: '#22B8CD',
+    paths: ['M19.785 0v7.272H22.5V17.62h-2.935V24l-7.037-6.194v6.145h-1.091v-6.152L4.392 24v-6.465H1.5V7.188h2.884V0l7.053 6.494V.19h1.09v6.49L19.786 0zm-7.257 9.044v7.319l5.946 5.234V14.44l-5.946-5.397zm-1.099-.08l-5.946 5.398v7.235l5.946-5.234V8.965zm8.136 7.58h1.844V8.349H13.46l6.105 5.54v2.655zm-8.982-8.28H2.59v8.195h1.8v-2.576l6.192-5.62zM5.475 2.476v4.71h5.115l-5.115-4.71zm13.219 0l-5.115 4.71h5.115v-4.71z']
+  },
+  jina: {
+    color: '#000000',
+    paths: ['M6.608 21.416a4.608 4.608 0 100-9.217 4.608 4.608 0 000 9.217zM20.894 2.015c.614 0 1.106.492 1.106 1.106v9.002c0 5.13-4.148 9.309-9.217 9.37v-9.355l-.03-9.032c0-.614.491-1.106 1.106-1.106h7.158l-.123.015z']
+  },
+  openrouter: {
+    color: '#6566F1',
+    paths: ['M16.804 1.957l7.22 4.105v.087L16.73 10.21l.017-2.117-.821-.03c-1.059-.028-1.611.002-2.268.11-1.064.175-2.038.577-3.147 1.352L8.345 11.03c-.284.195-.495.336-.68.455l-.515.322-.397.234.385.23.53.338c.476.314 1.17.796 2.701 1.866 1.11.775 2.083 1.177 3.147 1.352l.3.045c.694.091 1.375.094 2.825.033l.022-2.159 7.22 4.105v.087L16.589 22l.014-1.862-.635.022c-1.386.042-2.137.002-3.138-.162-1.694-.28-3.26-.926-4.881-2.059l-2.158-1.5a21.997 21.997 0 00-.755-.498l-.467-.28a55.927 55.927 0 00-.76-.43C2.908 14.73.563 14.116 0 14.116V9.888l.14.004c.564-.007 2.91-.622 3.809-1.124l1.016-.58.438-.274c.428-.28 1.072-.726 2.686-1.853 1.621-1.133 3.186-1.78 4.881-2.059 1.152-.19 1.974-.213 3.814-.138l.02-1.907z']
+  },
+  suno: {
+    color: '#000000',
+    paths: ['M16.5 0C20.642 0 24 5.373 24 12h-9c0 6.627-3.358 12-7.5 12C3.358 24 0 18.627 0 12h9c0-6.627 3.358-12 7.5-12z']
+  },
+  ollama: {
+    color: '#000000',
+    paths: ['M7.905 1.09c.216.085.411.225.588.41.295.306.544.744.734 1.263.191.522.315 1.1.362 1.68a5.054 5.054 0 012.049-.636l.051-.004c.87-.07 1.73.087 2.48.474.101.053.2.11.297.17.05-.569.172-1.134.36-1.644.19-.52.439-.957.733-1.264a1.67 1.67 0 01.589-.41c.257-.1.53-.118.796-.042.401.114.745.368 1.016.737.248.337.434.769.561 1.287.23.934.27 2.163.115 3.645l.053.04.026.019c.757.576 1.284 1.397 1.563 2.35.435 1.487.216 3.155-.534 4.088l-.018.021.002.003c.417.762.67 1.567.724 2.4l.002.03c.064 1.065-.2 2.137-.814 3.19l-.007.01.01.024c.472 1.157.62 2.322.438 3.486l-.006.039a.651.651 0 01-.747.536.648.648 0 01-.54-.742c.167-1.033.01-2.069-.48-3.123a.643.643 0 01.04-.617l.004-.006c.604-.924.854-1.83.8-2.72-.046-.779-.325-1.544-.8-2.273a.644.644 0 01.18-.886l.009-.006c.243-.159.467-.565.58-1.12a4.229 4.229 0 00-.095-1.974c-.205-.7-.58-1.284-1.105-1.683-.595-.454-1.383-.673-2.38-.61a.653.653 0 01-.632-.371c-.314-.665-.772-1.141-1.343-1.436a3.288 3.288 0 00-1.772-.332c-1.245.099-2.343.801-2.67 1.686a.652.652 0 01-.61.425c-1.067.002-1.893.252-2.497.703-.522.39-.878.935-1.066 1.588a4.07 4.07 0 00-.068 1.886c.112.558.331 1.02.582 1.269l.008.007c.212.207.257.53.109.785-.36.622-.629 1.549-.673 2.44-.05 1.018.186 1.902.719 2.536l.016.019a.643.643 0 01.095.69c-.576 1.236-.753 2.252-.562 3.052a.652.652 0 01-1.269.298c-.243-1.018-.078-2.184.473-3.498l.014-.035-.008-.012a4.339 4.339 0 01-.598-1.309l-.005-.019a5.764 5.764 0 01-.177-1.785c.044-.91.278-1.842.622-2.59l.012-.026-.002-.002c-.293-.418-.51-.953-.63-1.545l-.005-.024a5.352 5.352 0 01.093-2.49c.262-.915.777-1.701 1.536-2.269.06-.045.123-.09.186-.132-.159-1.493-.119-2.73.112-3.67.127-.518.314-.95.562-1.287.27-.368.614-.622 1.015-.737.266-.076.54-.059.797.042zm4.116 9.09c.936 0 1.8.313 2.446.855.63.527 1.005 1.235 1.005 1.94 0 .888-.406 1.58-1.133 2.022-.62.375-1.451.557-2.403.557-1.009 0-1.871-.259-2.493-.734-.617-.47-.963-1.13-.963-1.845 0-.707.398-1.417 1.056-1.946.668-.537 1.55-.849 2.485-.849zm0 .896a3.07 3.07 0 00-1.916.65c-.461.37-.722.835-.722 1.25 0 .428.21.829.61 1.134.455.347 1.124.548 1.943.548.799 0 1.473-.147 1.932-.426.463-.28.7-.686.7-1.257 0-.423-.246-.89-.683-1.256-.484-.405-1.14-.643-1.864-.643zm.662 1.21l.004.004c.12.151.095.37-.056.49l-.292.23v.446a.375.375 0 01-.376.373.375.375 0 01-.376-.373v-.46l-.271-.218a.347.347 0 01-.052-.49.353.353 0 01.494-.051l.215.172.22-.174a.353.353 0 01.49.051zm-5.04-1.919c.478 0 .867.39.867.871a.87.87 0 01-.868.871.87.87 0 01-.867-.87.87.87 0 01.867-.872zm8.706 0c.48 0 .868.39.868.871a.87.87 0 01-.868.871.87.87 0 01-.867-.87.87.87 0 01.867-.872zM7.44 2.3l-.003.002a.659.659 0 00-.285.238l-.005.006c-.138.189-.258.467-.348.832-.17.692-.216 1.631-.124 2.782.43-.128.899-.208 1.404-.237l.01-.001.019-.034c.046-.082.095-.161.148-.239.123-.771.022-1.692-.253-2.444-.134-.364-.297-.65-.453-.813a.628.628 0 00-.107-.09L7.44 2.3zm9.174.04l-.002.001a.628.628 0 00-.107.09c-.156.163-.32.45-.453.814-.29.794-.387 1.776-.23 2.572l.058.097.008.014h.03a5.184 5.184 0 011.466.212c.086-1.124.038-2.043-.128-2.722-.09-.365-.21-.643-.349-.832l-.004-.006a.659.659 0 00-.285-.239h-.004z']
+  },
+  ai360: {
+    color: '#23B7E5',
+    paths: ['M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z']
+  },
+  dify: {
+    color: '#1677FF',
+    paths: ['M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z']
+  },
+  coze: {
+    color: '#5436F5',
+    paths: ['M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z']
+  }
+}
+
+const fallbackText = computed(() => props.model.charAt(0).toUpperCase())
+
+const iconKey = computed(() => {
+  const modelLower = props.model.toLowerCase()
+
+  // OpenAI models
+  if (modelLower.startsWith('gpt') || modelLower.startsWith('o1') ||
+      modelLower.startsWith('o3') || modelLower.startsWith('o4') ||
+      modelLower.includes('chatgpt') || modelLower.includes('dall-e') ||
+      modelLower.includes('whisper') || modelLower.includes('tts-1') ||
+      modelLower.includes('text-embedding-3') || modelLower.includes('text-moderation') ||
+      modelLower.includes('babbage') || modelLower.includes('davinci') ||
+      modelLower.includes('curie') || modelLower.includes('ada')) return 'openai'
+
+  // Anthropic Claude
+  if (modelLower.includes('claude')) return 'claude'
+
+  // Google Gemini
+  if (modelLower.includes('gemini') || modelLower.includes('gemma') ||
+      modelLower.includes('learnlm') || modelLower.includes('imagen-') ||
+      modelLower.includes('veo-')) return 'gemini'
+
+  // Zhipu GLM
+  if (modelLower.includes('glm') || modelLower.includes('chatglm') ||
+      modelLower.includes('cogview') || modelLower.includes('cogvideo')) return 'zhipu'
+
+  // Alibaba Qwen
+  if (modelLower.includes('qwen') || modelLower.includes('qwq')) return 'qwen'
+
+  // DeepSeek
+  if (modelLower.includes('deepseek')) return 'deepseek'
+
+  // Mistral
+  if (modelLower.includes('mistral') || modelLower.includes('mixtral') ||
+      modelLower.includes('codestral') || modelLower.includes('pixtral') ||
+      modelLower.includes('voxtral') || modelLower.includes('magistral')) return 'mistral'
+
+  // Meta Llama
+  if (modelLower.includes('llama')) return 'meta'
+
+  // Cohere
+  if (modelLower.includes('command') || modelLower.includes('c4ai-') ||
+      modelLower.includes('embed-')) return 'cohere'
+
+  // Yi
+  if (modelLower.startsWith('yi-') || modelLower.startsWith('yi ')) return 'yi'
+
+  // xAI Grok
+  if (modelLower.includes('grok')) return 'xai'
+
+  // Moonshot
+  if (modelLower.includes('moonshot') || modelLower.includes('kimi')) return 'moonshot'
+
+  // Doubao (ByteDance)
+  if (modelLower.includes('doubao')) return 'doubao'
+
+  // MiniMax
+  if (modelLower.includes('abab') || modelLower.includes('minimax')) return 'minimax'
+
+  // Baidu Wenxin
+  if (modelLower.includes('ernie') || modelLower.includes('wenxin')) return 'wenxin'
+
+  // iFlytek Spark
+  if (modelLower.includes('spark')) return 'spark'
+
+  // Tencent Hunyuan
+  if (modelLower.includes('hunyuan')) return 'hunyuan'
+
+  // Cloudflare
+  if (modelLower.includes('@cf/')) return 'cloudflare'
+
+  // Midjourney
+  if (modelLower.includes('mj_') || modelLower.includes('midjourney')) return 'midjourney'
+
+  // Perplexity
+  if (modelLower.includes('perplexity') || modelLower.includes('pplx')) return 'perplexity'
+
+  // Jina
+  if (modelLower.includes('jina')) return 'jina'
+
+  // OpenRouter
+  if (modelLower.includes('openrouter')) return 'openrouter'
+
+  // Suno
+  if (modelLower.includes('suno')) return 'suno'
+
+  // Ollama
+  if (modelLower.includes('ollama')) return 'ollama'
+
+  // 360
+  if (modelLower.includes('360')) return 'ai360'
+
+  // Dify
+  if (modelLower.includes('dify')) return 'dify'
+
+  // Coze
+  if (modelLower.includes('coze')) return 'coze'
+
+  return null
+})
+
+const iconInfo = computed(() => iconKey.value ? iconData[iconKey.value] : null)
+</script>
+
+<style scoped>
+.model-icon {
+  flex-shrink: 0;
+}
+.model-icon-fallback {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 4px;
+  background: linear-gradient(135deg, #6366f1, #8b5cf6);
+  color: white;
+  font-weight: 600;
+  flex-shrink: 0;
+}
+</style>

frontend/src/components/common/SubscriptionProgressMini.vue

@@ -69,94 +69,108 @@
               </span>
             </div>
 
-            <!-- Progress bars -->
+            <!-- Progress bars or Unlimited badge -->
             <div class="space-y-1.5">
-              <div v-if="subscription.group?.daily_limit_usd" class="flex items-center gap-2">
-                <span class="w-8 flex-shrink-0 text-[10px] text-gray-500">{{
-                  t('subscriptionProgress.daily')
-                }}</span>
-                <div class="h-1.5 min-w-0 flex-1 rounded-full bg-gray-200 dark:bg-dark-600">
-                  <div
-                    class="h-1.5 rounded-full transition-all"
-                    :class="
-                      getProgressBarClass(
-                        subscription.daily_usage_usd,
-                        subscription.group?.daily_limit_usd
-                      )
-                    "
-                    :style="{
-                      width: getProgressWidth(
-                        subscription.daily_usage_usd,
-                        subscription.group?.daily_limit_usd
-                      )
-                    }"
-                  ></div>
-                </div>
-                <span class="w-24 flex-shrink-0 text-right text-[10px] text-gray-500">
-                  {{
-                    formatUsage(subscription.daily_usage_usd, subscription.group?.daily_limit_usd)
-                  }}
+              <!-- Unlimited subscription badge -->
+              <div
+                v-if="isUnlimited(subscription)"
+                class="flex items-center gap-2 rounded-lg bg-gradient-to-r from-emerald-50 to-teal-50 px-2.5 py-1.5 dark:from-emerald-900/20 dark:to-teal-900/20"
+              >
+                <span class="text-lg text-emerald-600 dark:text-emerald-400">∞</span>
+                <span class="text-xs font-medium text-emerald-700 dark:text-emerald-300">
+                  {{ t('subscriptionProgress.unlimited') }}
                 </span>
               </div>
 
-              <div v-if="subscription.group?.weekly_limit_usd" class="flex items-center gap-2">
-                <span class="w-8 flex-shrink-0 text-[10px] text-gray-500">{{
-                  t('subscriptionProgress.weekly')
-                }}</span>
-                <div class="h-1.5 min-w-0 flex-1 rounded-full bg-gray-200 dark:bg-dark-600">
-                  <div
-                    class="h-1.5 rounded-full transition-all"
-                    :class="
-                      getProgressBarClass(
-                        subscription.weekly_usage_usd,
-                        subscription.group?.weekly_limit_usd
-                      )
-                    "
-                    :style="{
-                      width: getProgressWidth(
-                        subscription.weekly_usage_usd,
-                        subscription.group?.weekly_limit_usd
-                      )
-                    }"
-                  ></div>
+              <!-- Progress bars for limited subscriptions -->
+              <template v-else>
+                <div v-if="subscription.group?.daily_limit_usd" class="flex items-center gap-2">
+                  <span class="w-8 flex-shrink-0 text-[10px] text-gray-500">{{
+                    t('subscriptionProgress.daily')
+                  }}</span>
+                  <div class="h-1.5 min-w-0 flex-1 rounded-full bg-gray-200 dark:bg-dark-600">
+                    <div
+                      class="h-1.5 rounded-full transition-all"
+                      :class="
+                        getProgressBarClass(
+                          subscription.daily_usage_usd,
+                          subscription.group?.daily_limit_usd
+                        )
+                      "
+                      :style="{
+                        width: getProgressWidth(
+                          subscription.daily_usage_usd,
+                          subscription.group?.daily_limit_usd
+                        )
+                      }"
+                    ></div>
+                  </div>
+                  <span class="w-24 flex-shrink-0 text-right text-[10px] text-gray-500">
+                    {{
+                      formatUsage(subscription.daily_usage_usd, subscription.group?.daily_limit_usd)
+                    }}
+                  </span>
                 </div>
-                <span class="w-24 flex-shrink-0 text-right text-[10px] text-gray-500">
-                  {{
-                    formatUsage(subscription.weekly_usage_usd, subscription.group?.weekly_limit_usd)
-                  }}
-                </span>
-              </div>
 
-              <div v-if="subscription.group?.monthly_limit_usd" class="flex items-center gap-2">
-                <span class="w-8 flex-shrink-0 text-[10px] text-gray-500">{{
-                  t('subscriptionProgress.monthly')
-                }}</span>
-                <div class="h-1.5 min-w-0 flex-1 rounded-full bg-gray-200 dark:bg-dark-600">
-                  <div
-                    class="h-1.5 rounded-full transition-all"
-                    :class="
-                      getProgressBarClass(
-                        subscription.monthly_usage_usd,
-                        subscription.group?.monthly_limit_usd
-                      )
-                    "
-                    :style="{
-                      width: getProgressWidth(
-                        subscription.monthly_usage_usd,
-                        subscription.group?.monthly_limit_usd
-                      )
-                    }"
-                  ></div>
+                <div v-if="subscription.group?.weekly_limit_usd" class="flex items-center gap-2">
+                  <span class="w-8 flex-shrink-0 text-[10px] text-gray-500">{{
+                    t('subscriptionProgress.weekly')
+                  }}</span>
+                  <div class="h-1.5 min-w-0 flex-1 rounded-full bg-gray-200 dark:bg-dark-600">
+                    <div
+                      class="h-1.5 rounded-full transition-all"
+                      :class="
+                        getProgressBarClass(
+                          subscription.weekly_usage_usd,
+                          subscription.group?.weekly_limit_usd
+                        )
+                      "
+                      :style="{
+                        width: getProgressWidth(
+                          subscription.weekly_usage_usd,
+                          subscription.group?.weekly_limit_usd
+                        )
+                      }"
+                    ></div>
+                  </div>
+                  <span class="w-24 flex-shrink-0 text-right text-[10px] text-gray-500">
+                    {{
+                      formatUsage(subscription.weekly_usage_usd, subscription.group?.weekly_limit_usd)
+                    }}
+                  </span>
                 </div>
-                <span class="w-24 flex-shrink-0 text-right text-[10px] text-gray-500">
-                  {{
-                    formatUsage(
-                      subscription.monthly_usage_usd,
-                      subscription.group?.monthly_limit_usd
-                    )
-                  }}
-                </span>
-              </div>
+
+                <div v-if="subscription.group?.monthly_limit_usd" class="flex items-center gap-2">
+                  <span class="w-8 flex-shrink-0 text-[10px] text-gray-500">{{
+                    t('subscriptionProgress.monthly')
+                  }}</span>
+                  <div class="h-1.5 min-w-0 flex-1 rounded-full bg-gray-200 dark:bg-dark-600">
+                    <div
+                      class="h-1.5 rounded-full transition-all"
+                      :class="
+                        getProgressBarClass(
+                          subscription.monthly_usage_usd,
+                          subscription.group?.monthly_limit_usd
+                        )
+                      "
+                      :style="{
+                        width: getProgressWidth(
+                          subscription.monthly_usage_usd,
+                          subscription.group?.monthly_limit_usd
+                        )
+                      }"
+                    ></div>
+                  </div>
+                  <span class="w-24 flex-shrink-0 text-right text-[10px] text-gray-500">
+                    {{
+                      formatUsage(
+                        subscription.monthly_usage_usd,
+                        subscription.group?.monthly_limit_usd
+                      )
+                    }}
+                  </span>
+                </div>
+              </template>
             </div>
           </div>
         </div>
@@ -215,7 +229,19 @@ function getMaxUsagePercentage(sub: UserSubscription): number {
   return percentages.length > 0 ? Math.max(...percentages) : 0
 }
 
+function isUnlimited(sub: UserSubscription): boolean {
+  return (
+    !sub.group?.daily_limit_usd &&
+    !sub.group?.weekly_limit_usd &&
+    !sub.group?.monthly_limit_usd
+  )
+}
+
 function getProgressDotClass(sub: UserSubscription): string {
+  // Unlimited subscriptions get a special color
+  if (isUnlimited(sub)) {
+    return 'bg-emerald-500'
+  }
   const maxPercentage = getMaxUsagePercentage(sub)
   if (maxPercentage >= 90) return 'bg-red-500'
   if (maxPercentage >= 70) return 'bg-orange-500'

frontend/src/components/keys/UseKeyModal.vue

@@ -28,7 +28,29 @@
           {{ platformDescription }}
         </p>
 
-        <!-- OS Tabs -->
+        <!-- Client Tabs (only for Antigravity platform) -->
+        <div v-if="platform === 'antigravity'" class="border-b border-gray-200 dark:border-dark-700">
+          <nav class="-mb-px flex space-x-6" aria-label="Client">
+            <button
+              v-for="tab in clientTabs"
+              :key="tab.id"
+              @click="activeClientTab = tab.id"
+              :class="[
+                'whitespace-nowrap py-2.5 px-1 border-b-2 font-medium text-sm transition-colors',
+                activeClientTab === tab.id
+                  ? 'border-primary-500 text-primary-600 dark:text-primary-400'
+                  : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300'
+              ]"
+            >
+              <span class="flex items-center gap-2">
+                <component :is="tab.icon" class="w-4 h-4" />
+                {{ tab.label }}
+              </span>
+            </button>
+          </nav>
+        </div>
+
+        <!-- OS/Shell Tabs -->
         <div class="border-b border-gray-200 dark:border-dark-700">
           <nav class="-mb-px flex space-x-4" aria-label="Tabs">
             <button
@@ -153,16 +175,21 @@ const { copyToClipboard: clipboardCopy } = useClipboard()
 
 const copiedIndex = ref<number | null>(null)
 const activeTab = ref<string>('unix')
+const activeClientTab = ref<string>('claude')  // Level 1 tab for antigravity platform
 
-// Reset active tab when platform changes
+// Reset tabs when platform changes
 watch(() => props.platform, (newPlatform) => {
-  if (newPlatform === 'openai') {
-    activeTab.value = 'unix'
-  } else {
-    activeTab.value = 'unix'
+  activeTab.value = 'unix'
+  if (newPlatform === 'antigravity') {
+    activeClientTab.value = 'claude'
   }
 })
 
+// Reset shell tab when client changes (for antigravity)
+watch(activeClientTab, () => {
+  activeTab.value = 'unix'
+})
+
 // Icon components
 const AppleIcon = {
   render() {
@@ -188,8 +215,52 @@ const WindowsIcon = {
   }
 }
 
-// Anthropic tabs (3 shell types)
-const anthropicTabs: TabConfig[] = [
+// Terminal icon for Claude Code
+const TerminalIcon = {
+  render() {
+    return h('svg', {
+      fill: 'none',
+      stroke: 'currentColor',
+      viewBox: '0 0 24 24',
+      'stroke-width': '1.5',
+      class: 'w-4 h-4'
+    }, [
+      h('path', {
+        'stroke-linecap': 'round',
+        'stroke-linejoin': 'round',
+        d: 'm6.75 7.5 3 2.25-3 2.25m4.5 0h3m-9 8.25h13.5A2.25 2.25 0 0 0 21 17.25V6.75A2.25 2.25 0 0 0 18.75 4.5H5.25A2.25 2.25 0 0 0 3 6.75v10.5A2.25 2.25 0 0 0 5.25 20.25Z'
+      })
+    ])
+  }
+}
+
+// Sparkle icon for Gemini
+const SparkleIcon = {
+  render() {
+    return h('svg', {
+      fill: 'none',
+      stroke: 'currentColor',
+      viewBox: '0 0 24 24',
+      'stroke-width': '1.5',
+      class: 'w-4 h-4'
+    }, [
+      h('path', {
+        'stroke-linecap': 'round',
+        'stroke-linejoin': 'round',
+        d: 'M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.894 20.567 16.5 21.75l-.394-1.183a2.25 2.25 0 0 0-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 0 0 1.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 0 0 1.423 1.423l1.183.394-1.183.394a2.25 2.25 0 0 0-1.423 1.423Z'
+      })
+    ])
+  }
+}
+
+// Client tabs for Antigravity platform (Level 1)
+const clientTabs = computed((): TabConfig[] => [
+  { id: 'claude', label: t('keys.useKeyModal.antigravity.claudeCode'), icon: TerminalIcon },
+  { id: 'gemini', label: t('keys.useKeyModal.antigravity.geminiCli'), icon: SparkleIcon }
+])
+
+// Shell tabs (3 types for environment variable based configs)
+const shellTabs: TabConfig[] = [
   { id: 'unix', label: 'macOS / Linux', icon: AppleIcon },
   { id: 'cmd', label: 'Windows CMD', icon: WindowsIcon },
   { id: 'powershell', label: 'PowerShell', icon: WindowsIcon }
@@ -203,26 +274,40 @@ const openaiTabs: TabConfig[] = [
 
 const currentTabs = computed(() => {
   if (props.platform === 'openai') {
-    return openaiTabs
+    return openaiTabs  // 2 tabs: unix, windows
   }
-  return anthropicTabs
+  // All other platforms (anthropic, gemini, antigravity) use shell tabs
+  return shellTabs
 })
 
 const platformDescription = computed(() => {
-  if (props.platform === 'openai') {
-    return t('keys.useKeyModal.openai.description')
+  switch (props.platform) {
+    case 'openai':
+      return t('keys.useKeyModal.openai.description')
+    case 'gemini':
+      return t('keys.useKeyModal.gemini.description')
+    case 'antigravity':
+      return t('keys.useKeyModal.antigravity.description')
+    default:
+      return t('keys.useKeyModal.description')
   }
-  return t('keys.useKeyModal.description')
 })
 
 const platformNote = computed(() => {
-  if (props.platform === 'openai') {
-    if (activeTab.value === 'windows') {
-      return t('keys.useKeyModal.openai.noteWindows')
-    }
-    return t('keys.useKeyModal.openai.note')
+  switch (props.platform) {
+    case 'openai':
+      return activeTab.value === 'windows'
+        ? t('keys.useKeyModal.openai.noteWindows')
+        : t('keys.useKeyModal.openai.note')
+    case 'gemini':
+      return t('keys.useKeyModal.gemini.note')
+    case 'antigravity':
+      return activeClientTab.value === 'claude'
+        ? t('keys.useKeyModal.antigravity.claudeNote')
+        : t('keys.useKeyModal.antigravity.geminiNote')
+    default:
+      return t('keys.useKeyModal.note')
   }
-  return t('keys.useKeyModal.note')
 })
 
 // Syntax highlighting helpers
@@ -231,11 +316,20 @@ const currentFiles = computed((): FileConfig[] => {
   const baseUrl = props.baseUrl || window.location.origin
   const apiKey = props.apiKey
 
-  if (props.platform === 'openai') {
-    return generateOpenAIFiles(baseUrl, apiKey)
+  switch (props.platform) {
+    case 'openai':
+      return generateOpenAIFiles(baseUrl, apiKey)
+    case 'gemini':
+      return [generateGeminiCliContent(baseUrl, apiKey)]
+    case 'antigravity':
+      // Both Claude Code and Gemini CLI need /antigravity suffix for antigravity platform
+      if (activeClientTab.value === 'claude') {
+        return generateAnthropicFiles(`${baseUrl}/antigravity`, apiKey)
+      }
+      return [generateGeminiCliContent(`${baseUrl}/antigravity`, apiKey)]
+    default: // anthropic
+      return generateAnthropicFiles(baseUrl, apiKey)
   }
-
-  return generateAnthropicFiles(baseUrl, apiKey)
 })
 
 function generateAnthropicFiles(baseUrl: string, apiKey: string): FileConfig[] {
@@ -266,6 +360,51 @@ $env:ANTHROPIC_AUTH_TOKEN="${apiKey}"`
   return [{ path, content }]
 }
 
+function generateGeminiCliContent(baseUrl: string, apiKey: string): FileConfig {
+  const model = 'gemini-2.5-pro'
+  const modelComment = t('keys.useKeyModal.gemini.modelComment')
+  let path: string
+  let content: string
+  let highlighted: string
+
+  switch (activeTab.value) {
+    case 'unix':
+      path = 'Terminal'
+      content = `export GOOGLE_GEMINI_BASE_URL="${baseUrl}"
+export GEMINI_API_KEY="${apiKey}"
+export GEMINI_MODEL="${model}"  # ${modelComment}`
+      highlighted = `${keyword('export')} ${variable('GOOGLE_GEMINI_BASE_URL')}${operator('=')}${string(`"${baseUrl}"`)}
+${keyword('export')} ${variable('GEMINI_API_KEY')}${operator('=')}${string(`"${apiKey}"`)}
+${keyword('export')} ${variable('GEMINI_MODEL')}${operator('=')}${string(`"${model}"`)}  ${comment(`# ${modelComment}`)}`
+      break
+    case 'cmd':
+      path = 'Command Prompt'
+      content = `set GOOGLE_GEMINI_BASE_URL=${baseUrl}
+set GEMINI_API_KEY=${apiKey}
+set GEMINI_MODEL=${model}`
+      highlighted = `${keyword('set')} ${variable('GOOGLE_GEMINI_BASE_URL')}${operator('=')}${baseUrl}
+${keyword('set')} ${variable('GEMINI_API_KEY')}${operator('=')}${apiKey}
+${keyword('set')} ${variable('GEMINI_MODEL')}${operator('=')}${model}
+${comment(`REM ${modelComment}`)}`
+      break
+    case 'powershell':
+      path = 'PowerShell'
+      content = `$env:GOOGLE_GEMINI_BASE_URL="${baseUrl}"
+$env:GEMINI_API_KEY="${apiKey}"
+$env:GEMINI_MODEL="${model}"  # ${modelComment}`
+      highlighted = `${keyword('$env:')}${variable('GOOGLE_GEMINI_BASE_URL')}${operator('=')}${string(`"${baseUrl}"`)}
+${keyword('$env:')}${variable('GEMINI_API_KEY')}${operator('=')}${string(`"${apiKey}"`)}
+${keyword('$env:')}${variable('GEMINI_MODEL')}${operator('=')}${string(`"${model}"`)}  ${comment(`# ${modelComment}`)}`
+      break
+    default:
+      path = 'Terminal'
+      content = ''
+      highlighted = ''
+  }
+
+  return { path, content, highlighted }
+}
+
 function generateOpenAIFiles(baseUrl: string, apiKey: string): FileConfig[] {
   const isWindows = activeTab.value === 'windows'
   const configDir = isWindows ? '%userprofile%\\.codex' : '~/.codex'

frontend/src/components/user/UserAttributeForm.vue

@@ -0,0 +1,207 @@
+<template>
+  <div v-if="attributes.length > 0" class="space-y-4">
+    <div v-for="attr in attributes" :key="attr.id">
+      <label class="input-label">
+        {{ attr.name }}
+        <span v-if="attr.required" class="text-red-500">*</span>
+      </label>
+
+      <!-- Text Input -->
+      <input
+        v-if="attr.type === 'text' || attr.type === 'email' || attr.type === 'url'"
+        v-model="localValues[attr.id]"
+        :type="attr.type === 'text' ? 'text' : attr.type"
+        :required="attr.required"
+        :placeholder="attr.placeholder"
+        class="input"
+        @input="emitChange"
+      />
+
+      <!-- Number Input -->
+      <input
+        v-else-if="attr.type === 'number'"
+        v-model.number="localValues[attr.id]"
+        type="number"
+        :required="attr.required"
+        :placeholder="attr.placeholder"
+        :min="attr.validation?.min"
+        :max="attr.validation?.max"
+        class="input"
+        @input="emitChange"
+      />
+
+      <!-- Date Input -->
+      <input
+        v-else-if="attr.type === 'date'"
+        v-model="localValues[attr.id]"
+        type="date"
+        :required="attr.required"
+        class="input"
+        @input="emitChange"
+      />
+
+      <!-- Textarea -->
+      <textarea
+        v-else-if="attr.type === 'textarea'"
+        v-model="localValues[attr.id]"
+        :required="attr.required"
+        :placeholder="attr.placeholder"
+        rows="3"
+        class="input"
+        @input="emitChange"
+      />
+
+      <!-- Select -->
+      <select
+        v-else-if="attr.type === 'select'"
+        v-model="localValues[attr.id]"
+        :required="attr.required"
+        class="input"
+        @change="emitChange"
+      >
+        <option value="">{{ t('common.selectOption') }}</option>
+        <option v-for="opt in attr.options" :key="opt.value" :value="opt.value">
+          {{ opt.label }}
+        </option>
+      </select>
+
+      <!-- Multi-Select (Checkboxes) -->
+      <div v-else-if="attr.type === 'multi_select'" class="space-y-2">
+        <label
+          v-for="opt in attr.options"
+          :key="opt.value"
+          class="flex items-center gap-2"
+        >
+          <input
+            type="checkbox"
+            :value="opt.value"
+            :checked="isOptionSelected(attr.id, opt.value)"
+            @change="toggleMultiSelectOption(attr.id, opt.value)"
+            class="h-4 w-4 rounded border-gray-300 text-primary-600"
+          />
+          <span class="text-sm text-gray-700 dark:text-gray-300">{{ opt.label }}</span>
+        </label>
+      </div>
+
+      <!-- Description -->
+      <p v-if="attr.description" class="input-hint">{{ attr.description }}</p>
+    </div>
+  </div>
+
+  <!-- Loading State -->
+  <div v-else-if="loading" class="flex justify-center py-4">
+    <svg class="h-5 w-5 animate-spin text-gray-400" fill="none" viewBox="0 0 24 24">
+      <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
+      <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
+    </svg>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, onMounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { adminAPI } from '@/api/admin'
+import type { UserAttributeDefinition, UserAttributeValuesMap } from '@/types'
+
+const { t } = useI18n()
+
+interface Props {
+  userId?: number
+  modelValue: UserAttributeValuesMap
+}
+
+interface Emits {
+  (e: 'update:modelValue', value: UserAttributeValuesMap): void
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<Emits>()
+
+const loading = ref(false)
+const attributes = ref<UserAttributeDefinition[]>([])
+const localValues = ref<UserAttributeValuesMap>({})
+
+const loadAttributes = async () => {
+  loading.value = true
+  try {
+    attributes.value = await adminAPI.userAttributes.listEnabledDefinitions()
+  } catch (error) {
+    console.error('Failed to load attributes:', error)
+  } finally {
+    loading.value = false
+  }
+}
+
+const loadUserValues = async () => {
+  if (!props.userId) return
+
+  try {
+    const values = await adminAPI.userAttributes.getUserAttributeValues(props.userId)
+    const valuesMap: UserAttributeValuesMap = {}
+    values.forEach(v => {
+      valuesMap[v.attribute_id] = v.value
+    })
+    localValues.value = { ...valuesMap }
+    emit('update:modelValue', localValues.value)
+  } catch (error) {
+    console.error('Failed to load user attribute values:', error)
+  }
+}
+
+const emitChange = () => {
+  emit('update:modelValue', { ...localValues.value })
+}
+
+const isOptionSelected = (attrId: number, optionValue: string): boolean => {
+  const value = localValues.value[attrId]
+  if (!value) return false
+  try {
+    const arr = JSON.parse(value)
+    return Array.isArray(arr) && arr.includes(optionValue)
+  } catch {
+    return false
+  }
+}
+
+const toggleMultiSelectOption = (attrId: number, optionValue: string) => {
+  let arr: string[] = []
+  const value = localValues.value[attrId]
+  if (value) {
+    try {
+      arr = JSON.parse(value)
+      if (!Array.isArray(arr)) arr = []
+    } catch {
+      arr = []
+    }
+  }
+
+  const index = arr.indexOf(optionValue)
+  if (index > -1) {
+    arr.splice(index, 1)
+  } else {
+    arr.push(optionValue)
+  }
+
+  localValues.value[attrId] = JSON.stringify(arr)
+  emitChange()
+}
+
+watch(() => props.modelValue, (newVal) => {
+  if (newVal && Object.keys(newVal).length > 0) {
+    localValues.value = { ...newVal }
+  }
+}, { immediate: true })
+
+watch(() => props.userId, (newUserId) => {
+  if (newUserId) {
+    loadUserValues()
+  } else {
+    // Reset for new user
+    localValues.value = {}
+  }
+}, { immediate: true })
+
+onMounted(() => {
+  loadAttributes()
+})
+</script>

frontend/src/components/user/UserAttributesConfigModal.vue

@@ -0,0 +1,404 @@
+<template>
+  <BaseDialog :show="show" :title="t('admin.users.attributes.title')" width="wide" @close="emit('close')">
+    <div class="space-y-4">
+      <!-- Header with Add Button -->
+      <div class="flex items-center justify-between">
+        <p class="text-sm text-gray-500 dark:text-dark-400">
+          {{ t('admin.users.attributes.description') }}
+        </p>
+        <button @click="openCreateModal" class="btn btn-primary btn-sm">
+          <svg class="mr-1.5 h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+          </svg>
+          {{ t('admin.users.attributes.addAttribute') }}
+        </button>
+      </div>
+
+      <!-- Loading State -->
+      <div v-if="loading" class="flex justify-center py-12">
+        <svg class="h-8 w-8 animate-spin text-primary-500" fill="none" viewBox="0 0 24 24">
+          <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
+          <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
+        </svg>
+      </div>
+
+      <!-- Empty State -->
+      <div v-else-if="attributes.length === 0" class="py-12 text-center">
+        <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1">
+          <path stroke-linecap="round" stroke-linejoin="round" d="M9.568 3H5.25A2.25 2.25 0 003 5.25v4.318c0 .597.237 1.17.659 1.591l9.581 9.581c.699.699 1.78.872 2.607.33a18.095 18.095 0 005.223-5.223c.542-.827.369-1.908-.33-2.607L11.16 3.66A2.25 2.25 0 009.568 3z" />
+          <path stroke-linecap="round" stroke-linejoin="round" d="M6 6h.008v.008H6V6z" />
+        </svg>
+        <p class="mt-2 text-sm text-gray-500 dark:text-dark-400">
+          {{ t('admin.users.attributes.noAttributes') }}
+        </p>
+        <p class="text-xs text-gray-400 dark:text-dark-500">
+          {{ t('admin.users.attributes.noAttributesHint') }}
+        </p>
+      </div>
+
+      <!-- Attributes List -->
+      <div v-else class="max-h-96 space-y-2 overflow-y-auto">
+        <div
+          v-for="attr in attributes"
+          :key="attr.id"
+          class="flex items-center gap-3 rounded-lg border border-gray-200 bg-white p-3 dark:border-dark-600 dark:bg-dark-800"
+        >
+          <!-- Drag Handle -->
+          <div class="cursor-move text-gray-400 hover:text-gray-600 dark:hover:text-gray-300" :title="t('admin.users.attributes.dragToReorder')">
+            <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
+            </svg>
+          </div>
+
+          <!-- Attribute Info -->
+          <div class="min-w-0 flex-1">
+            <div class="flex items-center gap-2">
+              <span class="font-medium text-gray-900 dark:text-white">{{ attr.name }}</span>
+              <span class="rounded bg-gray-100 px-1.5 py-0.5 font-mono text-xs text-gray-500 dark:bg-dark-700 dark:text-dark-400">
+                {{ attr.key }}
+              </span>
+              <span v-if="attr.required" class="badge badge-danger text-xs">
+                {{ t('admin.users.attributes.required') }}
+              </span>
+              <span v-if="!attr.enabled" class="badge badge-gray text-xs">
+                {{ t('common.disabled') }}
+              </span>
+            </div>
+            <div class="mt-0.5 flex items-center gap-2 text-xs text-gray-500 dark:text-dark-400">
+              <span class="badge badge-gray">{{ t(`admin.users.attributes.types.${attr.type}`) }}</span>
+              <span v-if="attr.description" class="truncate">{{ attr.description }}</span>
+            </div>
+          </div>
+
+          <!-- Actions -->
+          <div class="flex items-center gap-1">
+            <button
+              @click="openEditModal(attr)"
+              class="rounded-lg p-1.5 text-gray-500 hover:bg-gray-100 hover:text-primary-600 dark:hover:bg-dark-700 dark:hover:text-primary-400"
+              :title="t('common.edit')"
+            >
+              <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10" />
+              </svg>
+            </button>
+            <button
+              @click="confirmDelete(attr)"
+              class="rounded-lg p-1.5 text-gray-500 hover:bg-red-50 hover:text-red-600 dark:hover:bg-red-900/20 dark:hover:text-red-400"
+              :title="t('common.delete')"
+            >
+              <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
+                <path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" />
+              </svg>
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="flex justify-end">
+        <button @click="emit('close')" class="btn btn-secondary">
+          {{ t('common.close') }}
+        </button>
+      </div>
+    </template>
+  </BaseDialog>
+
+  <!-- Create/Edit Attribute Modal -->
+  <BaseDialog
+    :show="showEditModal"
+    :title="editingAttribute ? t('admin.users.attributes.editAttribute') : t('admin.users.attributes.addAttribute')"
+    width="normal"
+    @close="closeEditModal"
+  >
+    <form id="attribute-form" @submit.prevent="handleSave" class="space-y-4">
+      <!-- Key -->
+      <div>
+        <label class="input-label">{{ t('admin.users.attributes.key') }}</label>
+        <input
+          v-model="form.key"
+          type="text"
+          required
+          pattern="^[a-zA-Z][a-zA-Z0-9_]*$"
+          class="input font-mono"
+          :placeholder="t('admin.users.attributes.keyHint')"
+          :disabled="!!editingAttribute"
+        />
+        <p class="input-hint">{{ t('admin.users.attributes.keyHint') }}</p>
+      </div>
+
+      <!-- Name -->
+      <div>
+        <label class="input-label">{{ t('admin.users.attributes.name') }}</label>
+        <input
+          v-model="form.name"
+          type="text"
+          required
+          class="input"
+          :placeholder="t('admin.users.attributes.nameHint')"
+        />
+      </div>
+
+      <!-- Type -->
+      <div>
+        <label class="input-label">{{ t('admin.users.attributes.type') }}</label>
+        <select v-model="form.type" class="input" required>
+          <option v-for="type in attributeTypes" :key="type" :value="type">
+            {{ t(`admin.users.attributes.types.${type}`) }}
+          </option>
+        </select>
+      </div>
+
+      <!-- Options (for select/multi_select) -->
+      <div v-if="form.type === 'select' || form.type === 'multi_select'" class="space-y-2">
+        <label class="input-label">{{ t('admin.users.attributes.options') }}</label>
+        <div v-for="(option, index) in form.options" :key="index" class="flex items-center gap-2">
+          <input
+            v-model="option.value"
+            type="text"
+            class="input flex-1 font-mono text-sm"
+            :placeholder="t('admin.users.attributes.optionValue')"
+            required
+          />
+          <input
+            v-model="option.label"
+            type="text"
+            class="input flex-1 text-sm"
+            :placeholder="t('admin.users.attributes.optionLabel')"
+            required
+          />
+          <button
+            type="button"
+            @click="removeOption(index)"
+            class="rounded-lg p-1.5 text-gray-500 hover:bg-red-50 hover:text-red-600"
+          >
+            <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
+        </div>
+        <button type="button" @click="addOption" class="btn btn-secondary btn-sm">
+          <svg class="mr-1 h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+          </svg>
+          {{ t('admin.users.attributes.addOption') }}
+        </button>
+      </div>
+
+      <!-- Description -->
+      <div>
+        <label class="input-label">{{ t('admin.users.attributes.fieldDescription') }}</label>
+        <input
+          v-model="form.description"
+          type="text"
+          class="input"
+          :placeholder="t('admin.users.attributes.fieldDescriptionHint')"
+        />
+      </div>
+
+      <!-- Placeholder -->
+      <div>
+        <label class="input-label">{{ t('admin.users.attributes.placeholder') }}</label>
+        <input
+          v-model="form.placeholder"
+          type="text"
+          class="input"
+          :placeholder="t('admin.users.attributes.placeholderHint')"
+        />
+      </div>
+
+      <!-- Required & Enabled -->
+      <div class="flex items-center gap-6">
+        <label class="flex items-center gap-2">
+          <input v-model="form.required" type="checkbox" class="h-4 w-4 rounded border-gray-300 text-primary-600" />
+          <span class="text-sm text-gray-700 dark:text-gray-300">{{ t('admin.users.attributes.required') }}</span>
+        </label>
+        <label class="flex items-center gap-2">
+          <input v-model="form.enabled" type="checkbox" class="h-4 w-4 rounded border-gray-300 text-primary-600" />
+          <span class="text-sm text-gray-700 dark:text-gray-300">{{ t('admin.users.attributes.enabled') }}</span>
+        </label>
+      </div>
+    </form>
+
+    <template #footer>
+      <div class="flex justify-end gap-3">
+        <button @click="closeEditModal" type="button" class="btn btn-secondary">
+          {{ t('common.cancel') }}
+        </button>
+        <button type="submit" form="attribute-form" :disabled="saving" class="btn btn-primary">
+          <svg v-if="saving" class="-ml-1 mr-2 h-4 w-4 animate-spin" fill="none" viewBox="0 0 24 24">
+            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
+            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
+          </svg>
+          {{ saving ? t('common.saving') : (editingAttribute ? t('common.update') : t('common.create')) }}
+        </button>
+      </div>
+    </template>
+  </BaseDialog>
+
+  <!-- Delete Confirmation -->
+  <ConfirmDialog
+    :show="showDeleteDialog"
+    :title="t('admin.users.attributes.deleteAttribute')"
+    :message="t('admin.users.attributes.deleteConfirm', { name: deletingAttribute?.name })"
+    :confirm-text="t('common.delete')"
+    :cancel-text="t('common.cancel')"
+    :danger="true"
+    @confirm="handleDelete"
+    @cancel="showDeleteDialog = false"
+  />
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useAppStore } from '@/stores/app'
+import { adminAPI } from '@/api/admin'
+import type { UserAttributeDefinition, UserAttributeType, UserAttributeOption } from '@/types'
+import BaseDialog from '@/components/common/BaseDialog.vue'
+import ConfirmDialog from '@/components/common/ConfirmDialog.vue'
+
+const { t } = useI18n()
+const appStore = useAppStore()
+
+interface Props {
+  show: boolean
+}
+
+interface Emits {
+  (e: 'close'): void
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<Emits>()
+
+const attributeTypes: UserAttributeType[] = ['text', 'textarea', 'number', 'email', 'url', 'date', 'select', 'multi_select']
+
+const loading = ref(false)
+const saving = ref(false)
+const attributes = ref<UserAttributeDefinition[]>([])
+const showEditModal = ref(false)
+const showDeleteDialog = ref(false)
+const editingAttribute = ref<UserAttributeDefinition | null>(null)
+const deletingAttribute = ref<UserAttributeDefinition | null>(null)
+
+const form = reactive({
+  key: '',
+  name: '',
+  type: 'text' as UserAttributeType,
+  description: '',
+  placeholder: '',
+  required: false,
+  enabled: true,
+  options: [] as UserAttributeOption[]
+})
+
+const loadAttributes = async () => {
+  loading.value = true
+  try {
+    attributes.value = await adminAPI.userAttributes.listDefinitions()
+  } catch (error: any) {
+    appStore.showError(error.response?.data?.detail || t('admin.users.attributes.failedToLoad'))
+  } finally {
+    loading.value = false
+  }
+}
+
+const openCreateModal = () => {
+  editingAttribute.value = null
+  form.key = ''
+  form.name = ''
+  form.type = 'text'
+  form.description = ''
+  form.placeholder = ''
+  form.required = false
+  form.enabled = true
+  form.options = []
+  showEditModal.value = true
+}
+
+const openEditModal = (attr: UserAttributeDefinition) => {
+  editingAttribute.value = attr
+  form.key = attr.key
+  form.name = attr.name
+  form.type = attr.type
+  form.description = attr.description || ''
+  form.placeholder = attr.placeholder || ''
+  form.required = attr.required
+  form.enabled = attr.enabled
+  form.options = attr.options ? [...attr.options] : []
+  showEditModal.value = true
+}
+
+const closeEditModal = () => {
+  showEditModal.value = false
+  editingAttribute.value = null
+}
+
+const addOption = () => {
+  form.options.push({ value: '', label: '' })
+}
+
+const removeOption = (index: number) => {
+  form.options.splice(index, 1)
+}
+
+const handleSave = async () => {
+  saving.value = true
+  try {
+    const data = {
+      key: form.key,
+      name: form.name,
+      type: form.type,
+      description: form.description || undefined,
+      placeholder: form.placeholder || undefined,
+      required: form.required,
+      enabled: form.enabled,
+      options: (form.type === 'select' || form.type === 'multi_select') ? form.options : undefined
+    }
+
+    if (editingAttribute.value) {
+      await adminAPI.userAttributes.updateDefinition(editingAttribute.value.id, data)
+      appStore.showSuccess(t('admin.users.attributes.updated'))
+    } else {
+      await adminAPI.userAttributes.createDefinition(data)
+      appStore.showSuccess(t('admin.users.attributes.created'))
+    }
+
+    closeEditModal()
+    loadAttributes()
+  } catch (error: any) {
+    const msg = editingAttribute.value
+      ? t('admin.users.attributes.failedToUpdate')
+      : t('admin.users.attributes.failedToCreate')
+    appStore.showError(error.response?.data?.detail || msg)
+  } finally {
+    saving.value = false
+  }
+}
+
+const confirmDelete = (attr: UserAttributeDefinition) => {
+  deletingAttribute.value = attr
+  showDeleteDialog.value = true
+}
+
+const handleDelete = async () => {
+  if (!deletingAttribute.value) return
+
+  try {
+    await adminAPI.userAttributes.deleteDefinition(deletingAttribute.value.id)
+    appStore.showSuccess(t('admin.users.attributes.deleted'))
+    showDeleteDialog.value = false
+    deletingAttribute.value = null
+    loadAttributes()
+  } catch (error: any) {
+    appStore.showError(error.response?.data?.detail || t('admin.users.attributes.failedToDelete'))
+  }
+}
+
+watch(() => props.show, (isShow) => {
+  if (isShow) {
+    loadAttributes()
+  }
+})
+</script>

frontend/src/composables/useGeminiOAuth.ts

@@ -93,7 +93,13 @@ export function useGeminiOAuth() {
       const tokenInfo = await adminAPI.gemini.exchangeCode(payload as any)
       return tokenInfo as GeminiTokenInfo
     } catch (err: any) {
-      error.value = err.response?.data?.detail || t('admin.accounts.oauth.gemini.failedToExchangeCode')
+      // Check for specific missing project_id error
+      const errorMessage = err.message || err.response?.data?.message || ''
+      if (errorMessage.includes('missing project_id')) {
+        error.value = t('admin.accounts.oauth.gemini.missingProjectId')
+      } else {
+        error.value = errorMessage || t('admin.accounts.oauth.gemini.failedToExchangeCode')
+      }
       appStore.showError(error.value)
       return null
     } finally {

frontend/src/composables/useModelWhitelist.ts

@@ -0,0 +1,299 @@
+// =====================
+// 模型列表（硬编码，与 new-api 一致）
+// =====================
+
+// OpenAI
+const openaiModels = [
+  'gpt-3.5-turbo', 'gpt-3.5-turbo-0125', 'gpt-3.5-turbo-1106', 'gpt-3.5-turbo-16k',
+  'gpt-4', 'gpt-4-turbo', 'gpt-4-turbo-preview',
+  'gpt-4o', 'gpt-4o-2024-08-06', 'gpt-4o-2024-11-20',
+  'gpt-4o-mini', 'gpt-4o-mini-2024-07-18',
+  'gpt-4.5-preview',
+  'gpt-4.1', 'gpt-4.1-mini', 'gpt-4.1-nano',
+  'o1', 'o1-preview', 'o1-mini', 'o1-pro',
+  'o3', 'o3-mini', 'o3-pro',
+  'o4-mini',
+  'gpt-5', 'gpt-5-mini', 'gpt-5-nano',
+  'chatgpt-4o-latest',
+  'gpt-4o-audio-preview', 'gpt-4o-realtime-preview'
+]
+
+// Anthropic Claude
+export const claudeModels = [
+  'claude-3-5-sonnet-20241022', 'claude-3-5-sonnet-20240620',
+  'claude-3-5-haiku-20241022',
+  'claude-3-opus-20240229', 'claude-3-sonnet-20240229', 'claude-3-haiku-20240307',
+  'claude-3-7-sonnet-20250219',
+  'claude-sonnet-4-20250514', 'claude-opus-4-20250514',
+  'claude-opus-4-1-20250805',
+  'claude-sonnet-4-5-20250929', 'claude-haiku-4-5-20251001',
+  'claude-opus-4-5-20251101',
+  'claude-2.1', 'claude-2.0', 'claude-instant-1.2'
+]
+
+// Google Gemini
+const geminiModels = [
+  'gemini-2.0-flash', 'gemini-2.0-flash-lite-preview', 'gemini-2.0-flash-exp',
+  'gemini-2.0-pro-exp', 'gemini-2.0-flash-thinking-exp',
+  'gemini-2.5-pro-exp-03-25', 'gemini-2.5-pro-preview-03-25',
+  'gemini-3-pro-preview',
+  'gemini-1.5-pro', 'gemini-1.5-pro-latest',
+  'gemini-1.5-flash', 'gemini-1.5-flash-latest', 'gemini-1.5-flash-8b',
+  'gemini-exp-1206'
+]
+
+// 智谱 GLM
+const zhipuModels = [
+  'glm-4', 'glm-4v', 'glm-4-plus', 'glm-4-0520',
+  'glm-4-air', 'glm-4-airx', 'glm-4-long', 'glm-4-flash',
+  'glm-4v-plus', 'glm-4.5', 'glm-4.6',
+  'glm-3-turbo', 'glm-4-alltools',
+  'chatglm_turbo', 'chatglm_pro', 'chatglm_std', 'chatglm_lite',
+  'cogview-3', 'cogvideo'
+]
+
+// 阿里 通义千问
+const qwenModels = [
+  'qwen-turbo', 'qwen-plus', 'qwen-max', 'qwen-max-longcontext', 'qwen-long',
+  'qwen2-72b-instruct', 'qwen2-57b-a14b-instruct', 'qwen2-7b-instruct',
+  'qwen2.5-72b-instruct', 'qwen2.5-32b-instruct', 'qwen2.5-14b-instruct',
+  'qwen2.5-7b-instruct', 'qwen2.5-3b-instruct', 'qwen2.5-1.5b-instruct',
+  'qwen2.5-coder-32b-instruct', 'qwen2.5-coder-14b-instruct', 'qwen2.5-coder-7b-instruct',
+  'qwen3-235b-a22b',
+  'qwq-32b', 'qwq-32b-preview'
+]
+
+// DeepSeek
+const deepseekModels = [
+  'deepseek-chat', 'deepseek-coder', 'deepseek-reasoner',
+  'deepseek-v3', 'deepseek-v3-0324',
+  'deepseek-r1', 'deepseek-r1-0528',
+  'deepseek-r1-distill-qwen-32b', 'deepseek-r1-distill-qwen-14b', 'deepseek-r1-distill-qwen-7b',
+  'deepseek-r1-distill-llama-70b', 'deepseek-r1-distill-llama-8b'
+]
+
+// Mistral
+const mistralModels = [
+  'mistral-small-latest', 'mistral-medium-latest', 'mistral-large-latest',
+  'open-mistral-7b', 'open-mixtral-8x7b', 'open-mixtral-8x22b',
+  'codestral-latest', 'codestral-mamba',
+  'pixtral-12b-2409', 'pixtral-large-latest'
+]
+
+// Meta Llama
+const metaModels = [
+  'llama-3.3-70b-instruct',
+  'llama-3.2-90b-vision-instruct', 'llama-3.2-11b-vision-instruct',
+  'llama-3.2-3b-instruct', 'llama-3.2-1b-instruct',
+  'llama-3.1-405b-instruct', 'llama-3.1-70b-instruct', 'llama-3.1-8b-instruct',
+  'llama-3-70b-instruct', 'llama-3-8b-instruct',
+  'codellama-70b-instruct', 'codellama-34b-instruct', 'codellama-13b-instruct'
+]
+
+// xAI Grok
+const xaiModels = [
+  'grok-4', 'grok-4-0709',
+  'grok-3-beta', 'grok-3-mini-beta', 'grok-3-fast-beta',
+  'grok-2', 'grok-2-vision', 'grok-2-image',
+  'grok-beta', 'grok-vision-beta'
+]
+
+// Cohere
+const cohereModels = [
+  'command-a-03-2025',
+  'command-r', 'command-r-plus',
+  'command-r-08-2024', 'command-r-plus-08-2024',
+  'c4ai-aya-23-35b', 'c4ai-aya-23-8b',
+  'command', 'command-light'
+]
+
+// Yi (01.AI)
+const yiModels = [
+  'yi-large', 'yi-large-turbo', 'yi-large-rag',
+  'yi-medium', 'yi-medium-200k',
+  'yi-spark', 'yi-vision',
+  'yi-1.5-34b-chat', 'yi-1.5-9b-chat', 'yi-1.5-6b-chat'
+]
+
+// Moonshot/Kimi
+const moonshotModels = [
+  'moonshot-v1-8k', 'moonshot-v1-32k', 'moonshot-v1-128k',
+  'kimi-latest'
+]
+
+// 字节跳动 豆包
+const doubaoModels = [
+  'doubao-pro-256k', 'doubao-pro-128k', 'doubao-pro-32k', 'doubao-pro-4k',
+  'doubao-lite-128k', 'doubao-lite-32k', 'doubao-lite-4k',
+  'doubao-vision-pro-32k', 'doubao-vision-lite-32k',
+  'doubao-1.5-pro-256k', 'doubao-1.5-pro-32k', 'doubao-1.5-lite-32k',
+  'doubao-1.5-pro-vision-32k', 'doubao-1.5-thinking-pro'
+]
+
+// MiniMax
+const minimaxModels = [
+  'abab6.5-chat', 'abab6.5s-chat', 'abab6.5s-chat-pro',
+  'abab6-chat',
+  'abab5.5-chat', 'abab5.5s-chat'
+]
+
+// 百度 文心
+const baiduModels = [
+  'ernie-4.0-8k-latest', 'ernie-4.0-8k', 'ernie-4.0-turbo-8k',
+  'ernie-3.5-8k', 'ernie-3.5-128k',
+  'ernie-speed-8k', 'ernie-speed-128k', 'ernie-speed-pro-128k',
+  'ernie-lite-8k', 'ernie-lite-pro-128k',
+  'ernie-tiny-8k'
+]
+
+// 讯飞 星火
+const sparkModels = [
+  'spark-desk', 'spark-desk-v1.1', 'spark-desk-v2.1',
+  'spark-desk-v3.1', 'spark-desk-v3.5', 'spark-desk-v4.0',
+  'spark-lite', 'spark-pro', 'spark-max', 'spark-ultra'
+]
+
+// 腾讯 混元
+const hunyuanModels = [
+  'hunyuan-lite', 'hunyuan-standard', 'hunyuan-standard-256k',
+  'hunyuan-pro', 'hunyuan-turbo', 'hunyuan-large',
+  'hunyuan-vision', 'hunyuan-code'
+]
+
+// Perplexity
+const perplexityModels = [
+  'sonar', 'sonar-pro', 'sonar-reasoning',
+  'llama-3-sonar-small-32k-online', 'llama-3-sonar-large-32k-online',
+  'llama-3-sonar-small-32k-chat', 'llama-3-sonar-large-32k-chat'
+]
+
+// 所有模型（去重）
+const allModelsList: string[] = [
+  ...openaiModels,
+  ...claudeModels,
+  ...geminiModels,
+  ...zhipuModels,
+  ...qwenModels,
+  ...deepseekModels,
+  ...mistralModels,
+  ...metaModels,
+  ...xaiModels,
+  ...cohereModels,
+  ...yiModels,
+  ...moonshotModels,
+  ...doubaoModels,
+  ...minimaxModels,
+  ...baiduModels,
+  ...sparkModels,
+  ...hunyuanModels,
+  ...perplexityModels
+]
+
+// 转换为下拉选项格式
+export const allModels = allModelsList.map(m => ({ value: m, label: m }))
+
+// =====================
+// 预设映射
+// =====================
+
+const anthropicPresetMappings = [
+  { label: 'Sonnet 4', from: 'claude-sonnet-4-20250514', to: 'claude-sonnet-4-20250514', color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400' },
+  { label: 'Sonnet 4.5', from: 'claude-sonnet-4-5-20250929', to: 'claude-sonnet-4-5-20250929', color: 'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400' },
+  { label: 'Opus 4.5', from: 'claude-opus-4-5-20251101', to: 'claude-opus-4-5-20251101', color: 'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400' },
+  { label: 'Haiku 3.5', from: 'claude-3-5-haiku-20241022', to: 'claude-3-5-haiku-20241022', color: 'bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-400' },
+  { label: 'Haiku 4.5', from: 'claude-haiku-4-5-20251001', to: 'claude-haiku-4-5-20251001', color: 'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400' },
+  { label: 'Opus->Sonnet', from: 'claude-opus-4-5-20251101', to: 'claude-sonnet-4-5-20250929', color: 'bg-amber-100 text-amber-700 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-400' }
+]
+
+const openaiPresetMappings = [
+  { label: 'GPT-4o', from: 'gpt-4o', to: 'gpt-4o', color: 'bg-green-100 text-green-700 hover:bg-green-200 dark:bg-green-900/30 dark:text-green-400' },
+  { label: 'GPT-4o Mini', from: 'gpt-4o-mini', to: 'gpt-4o-mini', color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400' },
+  { label: 'GPT-4.1', from: 'gpt-4.1', to: 'gpt-4.1', color: 'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400' },
+  { label: 'o1', from: 'o1', to: 'o1', color: 'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400' },
+  { label: 'o3', from: 'o3', to: 'o3', color: 'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400' },
+  { label: 'GPT-5', from: 'gpt-5', to: 'gpt-5', color: 'bg-amber-100 text-amber-700 hover:bg-amber-200 dark:bg-amber-900/30 dark:text-amber-400' }
+]
+
+const geminiPresetMappings = [
+  { label: 'Flash 2.0', from: 'gemini-2.0-flash', to: 'gemini-2.0-flash', color: 'bg-blue-100 text-blue-700 hover:bg-blue-200 dark:bg-blue-900/30 dark:text-blue-400' },
+  { label: 'Flash Lite', from: 'gemini-2.0-flash-lite-preview', to: 'gemini-2.0-flash-lite-preview', color: 'bg-indigo-100 text-indigo-700 hover:bg-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-400' },
+  { label: '1.5 Pro', from: 'gemini-1.5-pro', to: 'gemini-1.5-pro', color: 'bg-purple-100 text-purple-700 hover:bg-purple-200 dark:bg-purple-900/30 dark:text-purple-400' },
+  { label: '1.5 Flash', from: 'gemini-1.5-flash', to: 'gemini-1.5-flash', color: 'bg-emerald-100 text-emerald-700 hover:bg-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-400' }
+]
+
+// =====================
+// 常用错误码
+// =====================
+
+export const commonErrorCodes = [
+  { value: 401, label: 'Unauthorized' },
+  { value: 403, label: 'Forbidden' },
+  { value: 429, label: 'Rate Limit' },
+  { value: 500, label: 'Server Error' },
+  { value: 502, label: 'Bad Gateway' },
+  { value: 503, label: 'Unavailable' },
+  { value: 529, label: 'Overloaded' }
+]
+
+// =====================
+// 辅助函数
+// =====================
+
+// 按平台获取模型
+export function getModelsByPlatform(platform: string): string[] {
+  switch (platform) {
+    case 'openai': return openaiModels
+    case 'anthropic':
+    case 'claude': return claudeModels
+    case 'gemini': return geminiModels
+    case 'zhipu': return zhipuModels
+    case 'qwen': return qwenModels
+    case 'deepseek': return deepseekModels
+    case 'mistral': return mistralModels
+    case 'meta': return metaModels
+    case 'xai': return xaiModels
+    case 'cohere': return cohereModels
+    case 'yi': return yiModels
+    case 'moonshot': return moonshotModels
+    case 'doubao': return doubaoModels
+    case 'minimax': return minimaxModels
+    case 'baidu': return baiduModels
+    case 'spark': return sparkModels
+    case 'hunyuan': return hunyuanModels
+    case 'perplexity': return perplexityModels
+    default: return claudeModels
+  }
+}
+
+// 按平台获取预设映射
+export function getPresetMappingsByPlatform(platform: string) {
+  if (platform === 'openai') return openaiPresetMappings
+  if (platform === 'gemini') return geminiPresetMappings
+  return anthropicPresetMappings
+}
+
+// =====================
+// 构建模型映射对象（用于 API）
+// =====================
+
+export function buildModelMappingObject(
+  mode: 'whitelist' | 'mapping',
+  allowedModels: string[],
+  modelMappings: { from: string; to: string }[]
+): Record<string, string> | null {
+  const mapping: Record<string, string> = {}
+
+  if (mode === 'whitelist') {
+    for (const model of allowedModels) {
+      mapping[model] = model
+    }
+  } else {
+    for (const m of modelMappings) {
+      const from = m.from.trim()
+      const to = m.to.trim()
+      if (from && to) mapping[from] = to
+    }
+  }
+
+  return Object.keys(mapping).length > 0 ? mapping : null
+}

frontend/src/i18n/locales/en.ts

@@ -322,6 +322,18 @@ export default {
         note: 'Make sure the config directory exists. macOS/Linux users can run mkdir -p ~/.codex to create it.',
         noteWindows: 'Press Win+R and enter %userprofile%\\.codex to open the config directory. Create it manually if it does not exist.',
       },
+      antigravity: {
+        description: 'Configure API access for Antigravity group. Select the configuration method based on your client.',
+        claudeCode: 'Claude Code',
+        geminiCli: 'Gemini CLI',
+        claudeNote: 'These environment variables will be active in the current terminal session. For permanent configuration, add them to ~/.bashrc, ~/.zshrc, or the appropriate configuration file.',
+        geminiNote: 'These environment variables will be active in the current terminal session. For permanent configuration, add them to ~/.bashrc, ~/.zshrc, or the appropriate configuration file.',
+      },
+      gemini: {
+        description: 'Add the following environment variables to your terminal profile or run directly in terminal to configure Gemini CLI access.',
+        modelComment: 'If you have Gemini 3 access, you can use: gemini-3-pro-preview',
+        note: 'These environment variables will be active in the current terminal session. For permanent configuration, add them to ~/.bashrc, ~/.zshrc, or the appropriate configuration file.',
+      },
     },
     customKeyLabel: 'Custom Key',
     customKeyPlaceholder: 'Enter your custom key (min 16 chars)',
@@ -329,7 +341,15 @@ export default {
     customKeyTooShort: 'Custom key must be at least 16 characters',
     customKeyInvalidChars: 'Custom key can only contain letters, numbers, underscores, and hyphens',
     customKeyRequired: 'Please enter a custom key',
-    ccSwitchNotInstalled: 'CC-Switch is not installed or the protocol handler is not registered. Please install CC-Switch first or manually copy the API key.'
+    ccSwitchNotInstalled: 'CC-Switch is not installed or the protocol handler is not registered. Please install CC-Switch first or manually copy the API key.',
+    ccsClientSelect: {
+      title: 'Select Client',
+      description: 'Please select the client type to import to CC-Switch:',
+      claudeCode: 'Claude Code',
+      claudeCodeDesc: 'Import as Claude Code configuration',
+      geminiCli: 'Gemini CLI',
+      geminiCliDesc: 'Import as Gemini CLI configuration',
+    },
   },
 
   // Usage
@@ -435,9 +455,7 @@ export default {
     administrator: 'Administrator',
     user: 'User',
     username: 'Username',
-    wechat: 'WeChat ID',
     enterUsername: 'Enter username',
-    enterWechat: 'Enter WeChat ID',
     editProfile: 'Edit Profile',
     updateProfile: 'Update Profile',
     updating: 'Updating...',
@@ -566,12 +584,10 @@ export default {
       email: 'Email',
       password: 'Password',
       username: 'Username',
-      wechat: 'WeChat ID',
       notes: 'Notes',
       enterEmail: 'Enter email',
       enterPassword: 'Enter password',
       enterUsername: 'Enter username (optional)',
-      enterWechat: 'Enter WeChat ID (optional)',
       enterNotes: 'Enter notes (admin only)',
       notesHint: 'This note is only visible to administrators',
       enterNewPassword: 'Enter new password (optional)',
@@ -583,7 +599,6 @@ export default {
       columns: {
         user: 'User',
         username: 'Username',
-        wechat: 'WeChat ID',
         notes: 'Notes',
         role: 'Role',
         subscriptions: 'Subscriptions',
@@ -654,7 +669,67 @@ export default {
       failedToDeposit: 'Failed to deposit',
       failedToWithdraw: 'Failed to withdraw',
       useDepositWithdrawButtons: 'Please use deposit/withdraw buttons to adjust balance',
-      insufficientBalance: 'Insufficient balance, balance cannot be negative after withdrawal'
+      insufficientBalance: 'Insufficient balance, balance cannot be negative after withdrawal',
+      // Settings Dropdowns
+      filterSettings: 'Filter Settings',
+      columnSettings: 'Column Settings',
+      filterValue: 'Enter value',
+      // User Attributes
+      attributes: {
+        title: 'User Attributes',
+        description: 'Configure custom user attribute fields',
+        configButton: 'Attributes',
+        addAttribute: 'Add Attribute',
+        editAttribute: 'Edit Attribute',
+        deleteAttribute: 'Delete Attribute',
+        deleteConfirm: "Are you sure you want to delete attribute '{name}'? All user values for this attribute will be deleted.",
+        noAttributes: 'No custom attributes',
+        noAttributesHint: 'Click the button above to add custom attributes',
+        key: 'Attribute Key',
+        keyHint: 'For programmatic reference, only letters, numbers and underscores',
+        name: 'Display Name',
+        nameHint: 'Name shown in forms',
+        type: 'Attribute Type',
+        fieldDescription: 'Description',
+        fieldDescriptionHint: 'Description text for the attribute',
+        placeholder: 'Placeholder',
+        placeholderHint: 'Placeholder text for input field',
+        required: 'Required',
+        enabled: 'Enabled',
+        options: 'Options',
+        optionsHint: 'For select/multi-select types',
+        addOption: 'Add Option',
+        optionValue: 'Option Value',
+        optionLabel: 'Display Text',
+        validation: 'Validation Rules',
+        minLength: 'Min Length',
+        maxLength: 'Max Length',
+        min: 'Min Value',
+        max: 'Max Value',
+        pattern: 'Regex Pattern',
+        patternMessage: 'Validation Error Message',
+        types: {
+          text: 'Text',
+          textarea: 'Textarea',
+          number: 'Number',
+          email: 'Email',
+          url: 'URL',
+          date: 'Date',
+          select: 'Select',
+          multi_select: 'Multi-Select'
+        },
+        created: 'Attribute created successfully',
+        updated: 'Attribute updated successfully',
+        deleted: 'Attribute deleted successfully',
+        reordered: 'Attribute order updated successfully',
+        failedToLoad: 'Failed to load attributes',
+        failedToCreate: 'Failed to create attribute',
+        failedToUpdate: 'Failed to update attribute',
+        failedToDelete: 'Failed to delete attribute',
+        failedToReorder: 'Failed to update order',
+        keyExists: 'Attribute key already exists',
+        dragToReorder: 'Drag to reorder'
+      }
     },
 
     // Groups
@@ -750,6 +825,7 @@ export default {
       weekly: 'Weekly',
       monthly: 'Monthly',
       noLimits: 'No limits configured',
+      unlimited: 'Unlimited',
       resetNow: 'Resetting soon',
       windowNotActive: 'Window not active',
       resetInMinutes: 'Resets in {minutes}m',
@@ -945,6 +1021,15 @@ export default {
       actualModel: 'Actual model',
       addMapping: 'Add Mapping',
       mappingExists: 'Mapping for {model} already exists',
+      searchModels: 'Search models...',
+      noMatchingModels: 'No matching models',
+      fillRelatedModels: 'Fill related models',
+      clearAllModels: 'Clear all models',
+      customModelName: 'Custom model name',
+      enterCustomModelName: 'Enter custom model name',
+      addModel: 'Add',
+      modelExists: 'Model already exists',
+      modelCount: '{count} models',
       customErrorCodes: 'Custom Error Codes',
       customErrorCodesHint: 'Only stop scheduling for selected error codes',
       customErrorCodesWarning:
@@ -1076,16 +1161,17 @@ export default {
 	          failedToGenerateUrl: 'Failed to generate Gemini auth URL',
 	          missingExchangeParams: 'Missing auth code, session ID, or state',
 	          failedToExchangeCode: 'Failed to exchange Gemini auth code',
+	          missingProjectId: 'GCP Project ID retrieval failed: Your Google account is not linked to an active GCP project. Please activate GCP and bind a credit card in Google Cloud Console, or manually enter the Project ID during authorization.',
 	          modelPassthrough: 'Gemini Model Passthrough',
 	          modelPassthroughDesc:
 	            'All model requests are forwarded directly to the Gemini API without model restrictions or mappings.',
 	          stateWarningTitle: 'Note',
 	          stateWarningDesc: 'Recommended: paste the full callback URL (includes code & state).',
 	          oauthTypeLabel: 'OAuth Type',
-	          needsProjectId: 'For GCP Developers',
-	          needsProjectIdDesc: 'Requires GCP project',
-	          noProjectIdNeeded: 'For Regular Users',
-	          noProjectIdNeededDesc: 'Requires admin-configured OAuth client',
+          needsProjectId: 'Built-in OAuth (Code Assist)',
+          needsProjectIdDesc: 'Requires GCP project and Project ID',
+          noProjectIdNeeded: 'Custom OAuth (AI Studio)',
+          noProjectIdNeededDesc: 'Requires admin-configured OAuth client',
 	          aiStudioNotConfiguredShort: 'Not configured',
 	          aiStudioNotConfiguredTip:
 	            'AI Studio OAuth is not configured: set GEMINI_OAUTH_CLIENT_ID / GEMINI_OAUTH_CLIENT_SECRET and add Redirect URI: http://localhost:1455/auth/callback (Consent screen scopes must include https://www.googleapis.com/auth/generative-language.retriever)',
@@ -1120,7 +1206,100 @@ export default {
         modelPassthroughDesc:
           'All model requests are forwarded directly to the Gemini API without model restrictions or mappings.',
         baseUrlHint: 'Leave default for official Gemini API',
-        apiKeyHint: 'Your Gemini API Key (starts with AIza)'
+        apiKeyHint: 'Your Gemini API Key (starts with AIza)',
+        accountType: {
+          oauthTitle: 'OAuth (Gemini)',
+          oauthDesc: 'Authorize with your Google account and choose an OAuth type.',
+          apiKeyTitle: 'API Key (AI Studio)',
+          apiKeyDesc: 'Fastest setup. Use an AIza API key.',
+          apiKeyNote:
+            'Best for light testing. Free tier has strict rate limits and data may be used for training.',
+          apiKeyLink: 'Get API Key',
+          quotaLink: 'Quota guide'
+        },
+        oauthType: {
+          builtInTitle: 'Built-in OAuth (Gemini CLI / Code Assist)',
+          builtInDesc: 'Uses Google built-in client ID. No admin configuration required.',
+          builtInRequirement: 'Requires a GCP project and Project ID.',
+          gcpProjectLink: 'Create project',
+          customTitle: 'Custom OAuth (AI Studio OAuth)',
+          customDesc: 'Uses admin-configured OAuth client for org management.',
+          customRequirement: 'Admin must configure Client ID and add you as a test user.',
+          badges: {
+            recommended: 'Recommended',
+            highConcurrency: 'High concurrency',
+            noAdmin: 'No admin setup',
+            orgManaged: 'Org managed',
+            adminRequired: 'Admin required'
+          }
+        },
+        setupGuide: {
+          title: 'Gemini Setup Checklist',
+          checklistTitle: 'Checklist',
+          checklistItems: {
+            usIp: 'Use a US IP and ensure your account country is set to US.',
+            age: 'Account must be 18+.'
+          },
+          activationTitle: 'One-click Activation',
+          activationItems: {
+            geminiWeb: 'Activate Gemini Web to avoid User not initialized.',
+            gcpProject: 'Activate a GCP project and get the Project ID for Code Assist.'
+          },
+          links: {
+            countryCheck: 'Check country association',
+            geminiWebActivation: 'Activate Gemini Web',
+            gcpProject: 'Open GCP Console'
+          }
+        },
+        quotaPolicy: {
+          title: 'Gemini Quota & Limit Policy (Reference)',
+          note: 'Note: Gemini does not provide an official quota inquiry API. The "Daily Quota" shown here is an estimate simulated by the system based on account tiers for scheduling reference only. Please refer to official Google errors for actual limits.',
+          columns: {
+            channel: 'Auth Channel',
+            account: 'Account Status',
+            limits: 'Limit Policy',
+            docs: 'Official Docs'
+          },
+          docs: {
+            codeAssist: 'Code Assist Quotas',
+            aiStudio: 'AI Studio Pricing',
+            vertex: 'Vertex AI Quotas'
+          },
+          simulatedNote: 'Simulated quota, for reference only',
+          rows: {
+            cli: {
+              channel: 'Gemini CLI (Official Google Login / Code Assist)',
+              free: 'Free Google Account',
+              premium: 'Google One AI Premium',
+              limitsFree: 'RPD ~1000; RPM ~60 (soft)',
+              limitsPremium: 'RPD ~1500+; RPM ~60+ (priority queue)'
+            },
+            gcloud: {
+              channel: 'GCP Code Assist (gcloud auth)',
+              account: 'No Code Assist subscription',
+              limits: 'RPD ~1000; RPM ~60 (preview)'
+            },
+            aiStudio: {
+              channel: 'AI Studio API Key / OAuth',
+              free: 'No billing (free tier)',
+              paid: 'Billing enabled (pay-as-you-go)',
+              limitsFree: 'RPD 50; RPM 2 (Pro) / 15 (Flash)',
+              limitsPaid: 'RPD unlimited; RPM 1000+ (per model quota)'
+            },
+            customOAuth: {
+              channel: 'Custom OAuth Client (GCP)',
+              free: 'Project not billed',
+              paid: 'Project billed',
+              limitsFree: 'RPD 50; RPM 2 (project quota)',
+              limitsPaid: 'RPD unlimited; RPM 1000+ (project quota)'
+            }
+          }
+        },
+        rateLimit: {
+          ok: 'Not rate limited',
+          limited: 'Rate limited {time}',
+          now: 'now'
+        }
       },
       // Re-Auth Modal
       reAuthorizeAccount: 'Re-Authorize Account',
@@ -1186,6 +1365,9 @@ export default {
       },
       usageWindow: {
         statsTitle: '5-Hour Window Usage Statistics',
+        statsTitleDaily: 'Daily Usage Statistics',
+        geminiProDaily: 'Pro',
+        geminiFlashDaily: 'Flash',
         gemini3Pro: 'G3P',
         gemini3Flash: 'G3F',
         gemini3Image: 'G3I',
@@ -1194,7 +1376,12 @@ export default {
       tier: {
         free: 'Free',
         pro: 'Pro',
-        ultra: 'Ultra'
+        ultra: 'Ultra',
+        aiPremium: 'AI Premium',
+        standard: 'Standard',
+        basic: 'Basic',
+        personal: 'Personal',
+        unlimited: 'Unlimited'
       },
       ineligibleWarning:
         'This account is not eligible for Antigravity, but API forwarding still works. Use at your own risk.'
@@ -1496,7 +1683,8 @@ export default {
     expiresToday: 'Expires today',
     expiresTomorrow: 'Expires tomorrow',
     viewAll: 'View all subscriptions',
-    noSubscriptions: 'No active subscriptions'
+    noSubscriptions: 'No active subscriptions',
+    unlimited: 'Unlimited'
   },
 
   // Version Badge
@@ -1539,6 +1727,7 @@ export default {
     expires: 'Expires',
     noExpiration: 'No expiration',
     unlimited: 'Unlimited',
+    unlimitedDesc: 'No usage limits on this subscription',
     daily: 'Daily',
     weekly: 'Weekly',
     monthly: 'Monthly',

frontend/src/i18n/locales/zh.ts

@@ -318,6 +318,18 @@ export default {
         note: '请确保配置目录存在。macOS/Linux 用户可运行 mkdir -p ~/.codex 创建目录。',
         noteWindows: '按 Win+R，输入 %userprofile%\\.codex 打开配置目录。如目录不存在，请先手动创建。',
       },
+      antigravity: {
+        description: '为 Antigravity 分组配置 API 访问。请根据您使用的客户端选择对应的配置方式。',
+        claudeCode: 'Claude Code',
+        geminiCli: 'Gemini CLI',
+        claudeNote: '这些环境变量将在当前终端会话中生效。如需永久配置，请将其添加到 ~/.bashrc、~/.zshrc 或相应的配置文件中。',
+        geminiNote: '这些环境变量将在当前终端会话中生效。如需永久配置，请将其添加到 ~/.bashrc、~/.zshrc 或相应的配置文件中。',
+      },
+      gemini: {
+        description: '将以下环境变量添加到您的终端配置文件或直接在终端中运行，以配置 Gemini CLI 访问。',
+        modelComment: '如果你有 Gemini 3 权限可以填：gemini-3-pro-preview',
+        note: '这些环境变量将在当前终端会话中生效。如需永久配置，请将其添加到 ~/.bashrc、~/.zshrc 或相应的配置文件中。',
+      },
     },
     customKeyLabel: '自定义密钥',
     customKeyPlaceholder: '输入自定义密钥（至少16个字符）',
@@ -325,7 +337,15 @@ export default {
     customKeyTooShort: '自定义密钥至少需要16个字符',
     customKeyInvalidChars: '自定义密钥只能包含字母、数字、下划线和连字符',
     customKeyRequired: '请输入自定义密钥',
-    ccSwitchNotInstalled: 'CC-Switch 未安装或协议处理程序未注册。请先安装 CC-Switch 或手动复制 API 密钥。'
+    ccSwitchNotInstalled: 'CC-Switch 未安装或协议处理程序未注册。请先安装 CC-Switch 或手动复制 API 密钥。',
+    ccsClientSelect: {
+      title: '选择客户端',
+      description: '请选择您要导入到 CC-Switch 的客户端类型：',
+      claudeCode: 'Claude Code',
+      claudeCodeDesc: '导入为 Claude Code 配置',
+      geminiCli: 'Gemini CLI',
+      geminiCliDesc: '导入为 Gemini CLI 配置',
+    },
   },
 
   // Usage
@@ -431,9 +451,7 @@ export default {
     administrator: '管理员',
     user: '用户',
     username: '用户名',
-    wechat: '微信号',
     enterUsername: '输入用户名',
-    enterWechat: '输入微信号',
     editProfile: '编辑个人资料',
     updateProfile: '更新资料',
     updating: '更新中...',
@@ -584,12 +602,10 @@ export default {
       email: '邮箱',
       password: '密码',
       username: '用户名',
-      wechat: '微信号',
       notes: '备注',
       enterEmail: '请输入邮箱',
       enterPassword: '请输入密码',
       enterUsername: '请输入用户名（选填）',
-      enterWechat: '请输入微信号（选填）',
       enterNotes: '请输入备注（仅管理员可见）',
       notesHint: '此备注仅对管理员可见',
       enterNewPassword: '请输入新密码（选填）',
@@ -602,7 +618,6 @@ export default {
         user: '用户',
         email: '邮箱',
         username: '用户名',
-        wechat: '微信号',
         notes: '备注',
         role: '角色',
         subscriptions: '订阅分组',
@@ -656,8 +671,6 @@ export default {
         emailPlaceholder: '请输入邮箱',
         usernameLabel: '用户名',
         usernamePlaceholder: '请输入用户名（选填）',
-        wechatLabel: '微信号',
-        wechatPlaceholder: '请输入微信号（选填）',
         notesLabel: '备注',
         notesPlaceholder: '请输入备注（仅管理员可见）',
         notesHint: '此备注仅对管理员可见',
@@ -712,7 +725,67 @@ export default {
       failedToDeposit: '充值失败',
       failedToWithdraw: '退款失败',
       useDepositWithdrawButtons: '请使用充值/退款按钮调整余额',
-      insufficientBalance: '余额不足，退款后余额不能为负数'
+      insufficientBalance: '余额不足，退款后余额不能为负数',
+      // Settings Dropdowns
+      filterSettings: '筛选设置',
+      columnSettings: '列设置',
+      filterValue: '输入值',
+      // User Attributes
+      attributes: {
+        title: '用户属性配置',
+        description: '配置用户的自定义属性字段',
+        configButton: '属性配置',
+        addAttribute: '添加属性',
+        editAttribute: '编辑属性',
+        deleteAttribute: '删除属性',
+        deleteConfirm: "确定要删除属性 '{name}' 吗？所有用户的该属性值将被删除。",
+        noAttributes: '暂无自定义属性',
+        noAttributesHint: '点击上方按钮添加自定义属性',
+        key: '属性键',
+        keyHint: '用于程序引用，只能包含字母、数字和下划线',
+        name: '显示名称',
+        nameHint: '在表单中显示的名称',
+        type: '属性类型',
+        fieldDescription: '描述',
+        fieldDescriptionHint: '属性的说明文字',
+        placeholder: '占位符',
+        placeholderHint: '输入框的提示文字',
+        required: '必填',
+        enabled: '启用',
+        options: '选项配置',
+        optionsHint: '用于单选/多选类型',
+        addOption: '添加选项',
+        optionValue: '选项值',
+        optionLabel: '显示文本',
+        validation: '验证规则',
+        minLength: '最小长度',
+        maxLength: '最大长度',
+        min: '最小值',
+        max: '最大值',
+        pattern: '正则表达式',
+        patternMessage: '验证失败提示',
+        types: {
+          text: '单行文本',
+          textarea: '多行文本',
+          number: '数字',
+          email: '邮箱',
+          url: '链接',
+          date: '日期',
+          select: '单选',
+          multi_select: '多选'
+        },
+        created: '属性创建成功',
+        updated: '属性更新成功',
+        deleted: '属性删除成功',
+        reordered: '属性排序更新成功',
+        failedToLoad: '加载属性列表失败',
+        failedToCreate: '创建属性失败',
+        failedToUpdate: '更新属性失败',
+        failedToDelete: '删除属性失败',
+        failedToReorder: '更新排序失败',
+        keyExists: '属性键已存在',
+        dragToReorder: '拖拽排序'
+      }
     },
 
     // Groups Management
@@ -841,6 +914,7 @@ export default {
       weekly: '每周',
       monthly: '每月',
       noLimits: '未配置限额',
+      unlimited: '无限制',
       resetNow: '即将重置',
       windowNotActive: '窗口未激活',
       resetInMinutes: '{minutes} 分钟后重置',
@@ -985,6 +1059,9 @@ export default {
       },
       usageWindow: {
         statsTitle: '5小时窗口用量统计',
+        statsTitleDaily: '每日用量统计',
+        geminiProDaily: 'Pro',
+        geminiFlashDaily: 'Flash',
         gemini3Pro: 'G3P',
         gemini3Flash: 'G3F',
         gemini3Image: 'G3I',
@@ -993,7 +1070,12 @@ export default {
       tier: {
         free: 'Free',
         pro: 'Pro',
-        ultra: 'Ultra'
+        ultra: 'Ultra',
+        aiPremium: 'AI Premium',
+        standard: '标准版',
+        basic: '基础版',
+        personal: '个人版',
+        unlimited: '无限制'
       },
       ineligibleWarning:
         '该账号无 Antigravity 使用权限，但仍能进行 API 转发。继续使用请自行承担风险。',
@@ -1094,6 +1176,15 @@ export default {
       actualModel: '实际模型',
       addMapping: '添加映射',
       mappingExists: '模型 {model} 的映射已存在',
+      searchModels: '搜索模型...',
+      noMatchingModels: '没有匹配的模型',
+      fillRelatedModels: '填入相关模型',
+      clearAllModels: '清除所有模型',
+      customModelName: '自定义模型名称',
+      enterCustomModelName: '输入自定义模型名称',
+      addModel: '填入',
+      modelExists: '该模型已存在',
+      modelCount: '{count} 个模型',
       customErrorCodes: '自定义错误码',
       customErrorCodesHint: '仅对选中的错误码停止调度',
       customErrorCodesWarning: '仅选中的错误码会停止调度，其他错误将返回 500。',
@@ -1212,15 +1303,16 @@ export default {
 	          failedToGenerateUrl: '生成 Gemini 授权链接失败',
 	          missingExchangeParams: '缺少 code / session_id / state',
 	          failedToExchangeCode: 'Gemini 授权码兑换失败',
+	          missingProjectId: 'GCP Project ID 获取失败：您的 Google 账号未关联有效的 GCP 项目。请前往 Google Cloud Console 激活 GCP 并绑定信用卡，或在授权时手动填写 Project ID。',
 	          modelPassthrough: 'Gemini 直接转发模型',
 	          modelPassthroughDesc: '所有模型请求将直接转发至 Gemini API，不进行模型限制或映射。',
 	          stateWarningTitle: '提示',
 	          stateWarningDesc: '建议粘贴完整回调链接（包含 code 和 state）。',
 	          oauthTypeLabel: 'OAuth 类型',
-	          needsProjectId: '适合 GCP 开发者',
-	          needsProjectIdDesc: '需 GCP 项目',
-	          noProjectIdNeeded: '适合普通用户',
-	          noProjectIdNeededDesc: '需管理员配置 OAuth Client',
+          needsProjectId: '内置授权（Code Assist）',
+          needsProjectIdDesc: '需要 GCP 项目与 Project ID',
+          noProjectIdNeeded: '自定义授权（AI Studio）',
+          noProjectIdNeededDesc: '需管理员配置 OAuth Client',
 	          aiStudioNotConfiguredShort: '未配置',
 	          aiStudioNotConfiguredTip: 'AI Studio OAuth 未配置：请先设置 GEMINI_OAUTH_CLIENT_ID / GEMINI_OAUTH_CLIENT_SECRET，并在 Google OAuth Client 添加 Redirect URI：http://localhost:1455/auth/callback（Consent Screen scopes 需包含 https://www.googleapis.com/auth/generative-language.retriever）',
 	          aiStudioNotConfigured: 'AI Studio OAuth 未配置：请先设置 GEMINI_OAUTH_CLIENT_ID / GEMINI_OAUTH_CLIENT_SECRET，并在 Google OAuth Client 添加 Redirect URI：http://localhost:1455/auth/callback'
@@ -1252,7 +1344,99 @@ export default {
         modelPassthrough: 'Gemini 直接转发模型',
         modelPassthroughDesc: '所有模型请求将直接转发至 Gemini API，不进行模型限制或映射。',
         baseUrlHint: '留空使用官方 Gemini API',
-        apiKeyHint: '您的 Gemini API Key（以 AIza 开头）'
+        apiKeyHint: '您的 Gemini API Key（以 AIza 开头）',
+        accountType: {
+          oauthTitle: 'OAuth 授权（Gemini）',
+          oauthDesc: '使用 Google 账号授权，并选择 OAuth 子类型。',
+          apiKeyTitle: 'API 密钥（AI Studio）',
+          apiKeyDesc: '最快接入方式，使用 AIza API Key。',
+          apiKeyNote: '适合轻量测试。免费层限流严格，数据可能用于训练。',
+          apiKeyLink: '获取 API Key',
+          quotaLink: '配额说明'
+        },
+        oauthType: {
+          builtInTitle: '内置授权（Gemini CLI / Code Assist）',
+          builtInDesc: '使用 Google 内置客户端 ID，无需管理员配置。',
+          builtInRequirement: '需要 GCP 项目并填写 Project ID。',
+          gcpProjectLink: '创建项目',
+          customTitle: '自定义授权（AI Studio OAuth）',
+          customDesc: '使用管理员预设的 OAuth 客户端，适合组织管理。',
+          customRequirement: '需管理员配置 Client ID 并加入测试用户白名单。',
+          badges: {
+            recommended: '推荐',
+            highConcurrency: '高并发',
+            noAdmin: '无需管理员配置',
+            orgManaged: '组织管理',
+            adminRequired: '需要管理员'
+          }
+        },
+        setupGuide: {
+          title: 'Gemini 使用准备',
+          checklistTitle: '准备工作',
+          checklistItems: {
+            usIp: '使用美国 IP，并确保账号归属地为美国。',
+            age: '账号需满 18 岁。'
+          },
+          activationTitle: '服务激活',
+          activationItems: {
+            geminiWeb: '激活 Gemini Web，避免 User not initialized。',
+            gcpProject: '激活 GCP 项目，获取 Code Assist 所需 Project ID。'
+          },
+          links: {
+            countryCheck: '检查归属地',
+            geminiWebActivation: '激活 Gemini Web',
+            gcpProject: '打开 GCP 控制台'
+          }
+        },
+        quotaPolicy: {
+          title: 'Gemini 配额与限流政策（参考）',
+          note: '注意：Gemini 官方未提供用量查询接口。此处显示的“每日配额”是由系统根据账号等级模拟计算的估算值，仅供调度参考，请以 Google 官方实际报错为准。',
+          columns: {
+            channel: '授权通道',
+            account: '账号状态',
+            limits: '限流政策',
+            docs: '官方文档'
+          },
+          docs: {
+            codeAssist: 'Code Assist 配额',
+            aiStudio: 'AI Studio 定价',
+            vertex: 'Vertex AI 配额'
+          },
+          simulatedNote: '本地模拟配额，仅供参考',
+          rows: {
+            cli: {
+              channel: 'Gemini CLI（官方 Google 登录 / Code Assist）',
+              free: '免费 Google 账号',
+              premium: 'Google One AI Premium',
+              limitsFree: 'RPD ~1000；RPM ~60（软限制）',
+              limitsPremium: 'RPD ~1500+；RPM ~60+（优先队列）'
+            },
+            gcloud: {
+              channel: 'GCP Code Assist（gcloud 登录）',
+              account: '未购买 Code Assist 订阅',
+              limits: 'RPD ~1000；RPM ~60（预览期）'
+            },
+            aiStudio: {
+              channel: 'AI Studio API Key / OAuth',
+              free: '未绑卡（免费层）',
+              paid: '已绑卡（按量付费）',
+              limitsFree: 'RPD 50；RPM 2（Pro）/ 15（Flash）',
+              limitsPaid: 'RPD 不限；RPM 1000+（按模型配额）'
+            },
+            customOAuth: {
+              channel: 'Custom OAuth Client（GCP）',
+              free: '项目未绑卡',
+              paid: '项目已绑卡',
+              limitsFree: 'RPD 50；RPM 2（项目配额）',
+              limitsPaid: 'RPD 不限；RPM 1000+（项目配额）'
+            }
+          }
+        },
+        rateLimit: {
+          ok: '未限流',
+          limited: '限流 {time}',
+          now: '现在'
+        }
       },
       // Re-Auth Modal
       reAuthorizeAccount: '重新授权账号',
@@ -1693,7 +1877,8 @@ export default {
     expiresToday: '今天到期',
     expiresTomorrow: '明天到期',
     viewAll: '查看全部订阅',
-    noSubscriptions: '暂无有效订阅'
+    noSubscriptions: '暂无有效订阅',
+    unlimited: '无限制'
   },
 
   // Version Badge
@@ -1735,6 +1920,7 @@ export default {
     expires: '到期时间',
     noExpiration: '无到期时间',
     unlimited: '无限制',
+    unlimitedDesc: '该订阅无用量限制',
     daily: '每日',
     weekly: '每周',
     monthly: '每月',

frontend/src/types/index.ts

@@ -7,7 +7,6 @@
 export interface User {
   id: number
   username: string
-  wechat: string
   notes: string
   email: string
   role: 'admin' | 'user' // User role for authorization
@@ -315,6 +314,22 @@ export interface Proxy {
   updated_at: string
 }
 
+// Gemini credentials structure for OAuth and API Key authentication
+export interface GeminiCredentials {
+  // API Key authentication
+  api_key?: string
+
+  // OAuth authentication
+  access_token?: string
+  refresh_token?: string
+  oauth_type?: 'code_assist' | 'ai_studio' | string
+  tier_id?: 'LEGACY' | 'PRO' | 'ULTRA' | string
+  project_id?: string
+  token_type?: string
+  scope?: string
+  expires_at?: string
+}
+
 export interface Account {
   id: number
   name: string
@@ -366,6 +381,8 @@ export interface AccountUsageInfo {
   five_hour: UsageProgress | null
   seven_day: UsageProgress | null
   seven_day_sonnet: UsageProgress | null
+  gemini_pro_daily?: UsageProgress | null
+  gemini_flash_daily?: UsageProgress | null
 }
 
 // OpenAI Codex usage snapshot (from response headers)
@@ -616,7 +633,6 @@ export interface UpdateUserRequest {
   email?: string
   password?: string
   username?: string
-  wechat?: string
   notes?: string
   role?: 'admin' | 'user'
   balance?: number
@@ -753,3 +769,76 @@ export interface AccountUsageStatsResponse {
   summary: AccountUsageSummary
   models: ModelStat[]
 }
+
+// ==================== User Attribute Types ====================
+
+export type UserAttributeType = 'text' | 'textarea' | 'number' | 'email' | 'url' | 'date' | 'select' | 'multi_select'
+
+export interface UserAttributeOption {
+  value: string
+  label: string
+}
+
+export interface UserAttributeValidation {
+  min_length?: number
+  max_length?: number
+  min?: number
+  max?: number
+  pattern?: string
+  message?: string
+}
+
+export interface UserAttributeDefinition {
+  id: number
+  key: string
+  name: string
+  description: string
+  type: UserAttributeType
+  options: UserAttributeOption[]
+  required: boolean
+  validation: UserAttributeValidation
+  placeholder: string
+  display_order: number
+  enabled: boolean
+  created_at: string
+  updated_at: string
+}
+
+export interface UserAttributeValue {
+  id: number
+  user_id: number
+  attribute_id: number
+  value: string
+  created_at: string
+  updated_at: string
+}
+
+export interface CreateUserAttributeRequest {
+  key: string
+  name: string
+  description?: string
+  type: UserAttributeType
+  options?: UserAttributeOption[]
+  required?: boolean
+  validation?: UserAttributeValidation
+  placeholder?: string
+  display_order?: number
+  enabled?: boolean
+}
+
+export interface UpdateUserAttributeRequest {
+  key?: string
+  name?: string
+  description?: string
+  type?: UserAttributeType
+  options?: UserAttributeOption[]
+  required?: boolean
+  validation?: UserAttributeValidation
+  placeholder?: string
+  display_order?: number
+  enabled?: boolean
+}
+
+export interface UserAttributeValuesMap {
+  [attributeId: number]: string
+}

frontend/src/views/admin/SubscriptionsView.vue

@@ -202,16 +202,19 @@
                 </div>
               </div>
 
-              <!-- No Limits -->
+              <!-- No Limits - Unlimited badge -->
               <div
                 v-if="
                   !row.group?.daily_limit_usd &&
                   !row.group?.weekly_limit_usd &&
                   !row.group?.monthly_limit_usd
                 "
-                class="text-xs text-gray-500"
+                class="flex items-center gap-2 rounded-lg bg-gradient-to-r from-emerald-50 to-teal-50 px-3 py-2 dark:from-emerald-900/20 dark:to-teal-900/20"
               >
-                {{ t('admin.subscriptions.noLimits') }}
+                <span class="text-lg text-emerald-600 dark:text-emerald-400">∞</span>
+                <span class="text-xs font-medium text-emerald-700 dark:text-emerald-300">
+                  {{ t('admin.subscriptions.unlimited') }}
+                </span>
               </div>
             </div>
           </template>

frontend/src/views/admin/UsersView.vue

@@ -1,86 +1,289 @@
 <template>
   <AppLayout>
     <TablePageLayout>
-      <!-- Page Header Actions -->
-      <template #actions>
-        <div class="flex justify-end gap-3">
-        <button
-          @click="loadUsers"
-          :disabled="loading"
-          class="btn btn-secondary"
-          :title="t('common.refresh')"
-        >
-          <svg
-            :class="['h-5 w-5', loading ? 'animate-spin' : '']"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-            stroke-width="1.5"
-          >
-            <path
-              stroke-linecap="round"
-              stroke-linejoin="round"
-              d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99"
-            />
-          </svg>
-        </button>
-        <button @click="showCreateModal = true" class="btn btn-primary">
-          <svg
-            class="mr-2 h-5 w-5"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-            stroke-width="1.5"
-          >
-            <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
-          </svg>
-          {{ t('admin.users.createUser') }}
-        </button>
-      </div>
-      </template>
-
-      <!-- Search and Filters -->
+      <!-- Single Row: Search, Filters, and Actions -->
       <template #filters>
-      <div class="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
-        <div class="relative max-w-md flex-1">
-          <svg
-            class="absolute left-3 top-1/2 h-5 w-5 -translate-y-1/2 text-gray-400"
-            fill="none"
-            stroke="currentColor"
-            viewBox="0 0 24 24"
-            stroke-width="1.5"
-          >
-            <path
-              stroke-linecap="round"
-              stroke-linejoin="round"
-              d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
-            />
-          </svg>
-          <input
-            v-model="searchQuery"
-            type="text"
-            :placeholder="t('admin.users.searchUsers')"
-            class="input pl-10"
-            @input="handleSearch"
-          />
+        <div class="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
+          <!-- Left: Search + Active Filters -->
+          <div class="flex flex-1 flex-wrap items-center gap-3">
+            <!-- Search Box -->
+            <div class="relative w-64">
+              <svg
+                class="absolute left-3 top-1/2 h-5 w-5 -translate-y-1/2 text-gray-400"
+                fill="none"
+                stroke="currentColor"
+                viewBox="0 0 24 24"
+                stroke-width="1.5"
+              >
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
+                />
+              </svg>
+              <input
+                v-model="searchQuery"
+                type="text"
+                :placeholder="t('admin.users.searchUsers')"
+                class="input pl-10"
+                @input="handleSearch"
+              />
+            </div>
+
+            <!-- Role Filter (visible when enabled) -->
+            <div v-if="visibleFilters.has('role')" class="relative">
+              <select
+                v-model="filters.role"
+                @change="applyFilter"
+                class="input w-32 cursor-pointer appearance-none pr-8"
+              >
+                <option value="">{{ t('admin.users.allRoles') }}</option>
+                <option value="admin">{{ t('admin.users.admin') }}</option>
+                <option value="user">{{ t('admin.users.user') }}</option>
+              </select>
+              <svg
+                class="pointer-events-none absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400"
+                fill="none"
+                stroke="currentColor"
+                viewBox="0 0 24 24"
+                stroke-width="1.5"
+              >
+                <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
+              </svg>
+            </div>
+
+            <!-- Status Filter (visible when enabled) -->
+            <div v-if="visibleFilters.has('status')" class="relative">
+              <select
+                v-model="filters.status"
+                @change="applyFilter"
+                class="input w-32 cursor-pointer appearance-none pr-8"
+              >
+                <option value="">{{ t('admin.users.allStatus') }}</option>
+                <option value="active">{{ t('common.active') }}</option>
+                <option value="disabled">{{ t('admin.users.disabled') }}</option>
+              </select>
+              <svg
+                class="pointer-events-none absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400"
+                fill="none"
+                stroke="currentColor"
+                viewBox="0 0 24 24"
+                stroke-width="1.5"
+              >
+                <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
+              </svg>
+            </div>
+
+            <!-- Dynamic Attribute Filters -->
+            <template v-for="(value, attrId) in activeAttributeFilters" :key="attrId">
+              <div v-if="visibleFilters.has(`attr_${attrId}`)" class="relative">
+                <!-- Text/Email/URL/Textarea/Date type: styled input -->
+                <input
+                  v-if="['text', 'textarea', 'email', 'url', 'date'].includes(getAttributeDefinition(Number(attrId))?.type || 'text')"
+                  :value="value"
+                  @input="(e) => updateAttributeFilter(Number(attrId), (e.target as HTMLInputElement).value)"
+                  @keyup.enter="applyFilter"
+                  :placeholder="getAttributeDefinitionName(Number(attrId))"
+                  class="input w-36"
+                />
+                <!-- Number type: number input -->
+                <input
+                  v-else-if="getAttributeDefinition(Number(attrId))?.type === 'number'"
+                  :value="value"
+                  type="number"
+                  @input="(e) => updateAttributeFilter(Number(attrId), (e.target as HTMLInputElement).value)"
+                  @keyup.enter="applyFilter"
+                  :placeholder="getAttributeDefinitionName(Number(attrId))"
+                  class="input w-32"
+                />
+                <!-- Select/Multi-select type -->
+                <template v-else-if="['select', 'multi_select'].includes(getAttributeDefinition(Number(attrId))?.type || '')">
+                  <select
+                    :value="value"
+                    @change="(e) => { updateAttributeFilter(Number(attrId), (e.target as HTMLSelectElement).value); applyFilter() }"
+                    class="input w-36 cursor-pointer appearance-none pr-8"
+                  >
+                    <option value="">{{ getAttributeDefinitionName(Number(attrId)) }}</option>
+                    <option
+                      v-for="opt in getAttributeDefinition(Number(attrId))?.options || []"
+                      :key="opt.value"
+                      :value="opt.value"
+                    >
+                      {{ opt.label }}
+                    </option>
+                  </select>
+                  <svg
+                    class="pointer-events-none absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    stroke-width="1.5"
+                  >
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
+                  </svg>
+                </template>
+                <!-- Fallback -->
+                <input
+                  v-else
+                  :value="value"
+                  @input="(e) => updateAttributeFilter(Number(attrId), (e.target as HTMLInputElement).value)"
+                  @keyup.enter="applyFilter"
+                  :placeholder="getAttributeDefinitionName(Number(attrId))"
+                  class="input w-36"
+                />
+              </div>
+            </template>
+          </div>
+
+          <!-- Right: Actions and Settings -->
+          <div class="flex items-center gap-3">
+            <!-- Refresh Button -->
+            <button
+              @click="loadUsers"
+              :disabled="loading"
+              class="btn btn-secondary"
+              :title="t('common.refresh')"
+            >
+              <svg
+                :class="['h-5 w-5', loading ? 'animate-spin' : '']"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+                stroke-width="1.5"
+              >
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99"
+                />
+              </svg>
+            </button>
+            <!-- Filter Settings Dropdown -->
+            <div class="relative" ref="filterDropdownRef">
+              <button
+                @click="showFilterDropdown = !showFilterDropdown"
+                class="btn btn-secondary"
+              >
+                <svg class="mr-1.5 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 01-.659 1.591l-5.432 5.432a2.25 2.25 0 00-.659 1.591v2.927a2.25 2.25 0 01-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 00-.659-1.591L3.659 7.409A2.25 2.25 0 013 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0112 3z" />
+                </svg>
+                {{ t('admin.users.filterSettings') }}
+              </button>
+              <!-- Dropdown menu -->
+              <div
+                v-if="showFilterDropdown"
+                class="absolute right-0 top-full z-50 mt-1 w-48 rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-dark-600 dark:bg-dark-800"
+              >
+                <!-- Built-in filters -->
+                <button
+                  v-for="filter in builtInFilters"
+                  :key="filter.key"
+                  @click="toggleBuiltInFilter(filter.key)"
+                  class="flex w-full items-center justify-between px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-dark-700"
+                >
+                  <span>{{ filter.name }}</span>
+                  <svg
+                    v-if="visibleFilters.has(filter.key)"
+                    class="h-4 w-4 text-primary-500"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    stroke-width="2"
+                  >
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
+                  </svg>
+                </button>
+                <!-- Divider if custom attributes exist -->
+                <div
+                  v-if="filterableAttributes.length > 0"
+                  class="my-1 border-t border-gray-100 dark:border-dark-700"
+                ></div>
+                <!-- Custom attribute filters -->
+                <button
+                  v-for="attr in filterableAttributes"
+                  :key="attr.id"
+                  @click="toggleAttributeFilter(attr)"
+                  class="flex w-full items-center justify-between px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-dark-700"
+                >
+                  <span>{{ attr.name }}</span>
+                  <svg
+                    v-if="visibleFilters.has(`attr_${attr.id}`)"
+                    class="h-4 w-4 text-primary-500"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    stroke-width="2"
+                  >
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
+                  </svg>
+                </button>
+              </div>
+            </div>
+            <!-- Column Settings Dropdown -->
+            <div class="relative" ref="columnDropdownRef">
+              <button
+                @click="showColumnDropdown = !showColumnDropdown"
+                class="btn btn-secondary"
+              >
+                <svg class="mr-1.5 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M9 4.5v15m6-15v15m-10.875 0h15.75c.621 0 1.125-.504 1.125-1.125V5.625c0-.621-.504-1.125-1.125-1.125H4.125C3.504 4.5 3 5.004 3 5.625v12.75c0 .621.504 1.125 1.125 1.125z" />
+                </svg>
+                {{ t('admin.users.columnSettings') }}
+              </button>
+              <!-- Dropdown menu -->
+              <div
+                v-if="showColumnDropdown"
+                class="absolute right-0 top-full z-50 mt-1 max-h-80 w-48 overflow-y-auto rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-dark-600 dark:bg-dark-800"
+              >
+                <button
+                  v-for="col in toggleableColumns"
+                  :key="col.key"
+                  @click="toggleColumn(col.key)"
+                  class="flex w-full items-center justify-between px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-dark-700"
+                >
+                  <span>{{ col.label }}</span>
+                  <svg
+                    v-if="isColumnVisible(col.key)"
+                    class="h-4 w-4 text-primary-500"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    stroke-width="2"
+                  >
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
+                  </svg>
+                </button>
+              </div>
+            </div>
+            <!-- Attributes Config Button -->
+            <button @click="showAttributesModal = true" class="btn btn-secondary">
+              <svg
+                class="mr-1.5 h-4 w-4"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+                stroke-width="1.5"
+              >
+                <path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.324.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 011.37.49l1.296 2.247a1.125 1.125 0 01-.26 1.431l-1.003.827c-.293.24-.438.613-.431.992a6.759 6.759 0 010 .255c-.007.378.138.75.43.99l1.005.828c.424.35.534.954.26 1.43l-1.298 2.247a1.125 1.125 0 01-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.57 6.57 0 01-.22.128c-.331.183-.581.495-.644.869l-.213 1.28c-.09.543-.56.941-1.11.941h-2.594c-.55 0-1.02-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 01-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 01-1.369-.49l-1.297-2.247a1.125 1.125 0 01.26-1.431l1.004-.827c.292-.24.437-.613.43-.992a6.932 6.932 0 010-.255c.007-.378-.138-.75-.43-.99l-1.004-.828a1.125 1.125 0 01-.26-1.43l1.297-2.247a1.125 1.125 0 011.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.087.22-.128.332-.183.582-.495.644-.869l.214-1.281z" />
+                <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+              </svg>
+              {{ t('admin.users.attributes.configButton') }}
+            </button>
+            <!-- Create User Button -->
+            <button @click="showCreateModal = true" class="btn btn-primary">
+              <svg
+                class="mr-2 h-5 w-5"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+                stroke-width="1.5"
+              >
+                <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+              </svg>
+              {{ t('admin.users.createUser') }}
+            </button>
+          </div>
         </div>
-        <div class="flex flex-wrap gap-3">
-          <Select
-            v-model="filters.role"
-            :options="roleOptions"
-            :placeholder="t('admin.users.allRoles')"
-            class="w-36"
-            @change="loadUsers"
-          />
-          <Select
-            v-model="filters.status"
-            :options="statusOptions"
-            :placeholder="t('admin.users.allStatus')"
-            class="w-36"
-            @change="loadUsers"
-          />
-        </div>
-      </div>
       </template>
 
       <!-- Users Table -->
@@ -103,10 +306,6 @@
             <span class="text-sm text-gray-700 dark:text-gray-300">{{ value || '-' }}</span>
           </template>
 
-          <template #cell-wechat="{ value }">
-            <span class="text-sm text-gray-700 dark:text-gray-300">{{ value || '-' }}</span>
-          </template>
-
           <template #cell-notes="{ value }">
             <div class="max-w-xs">
               <span
@@ -120,6 +319,22 @@
             </div>
           </template>
 
+          <!-- Dynamic attribute columns -->
+          <template
+            v-for="def in attributeDefinitions.filter(d => d.enabled)"
+            :key="def.id"
+            #[`cell-attr_${def.id}`]="{ row }"
+          >
+            <div class="max-w-xs">
+              <span
+                class="block truncate text-sm text-gray-700 dark:text-gray-300"
+                :title="getAttributeValue(row.id, def.id)"
+              >
+                {{ getAttributeValue(row.id, def.id) }}
+              </span>
+            </div>
+          </template>
+
           <template #cell-role="{ value }">
             <span :class="['badge', value === 'admin' ? 'badge-purple' : 'badge-gray']">
               {{ value }}
@@ -189,9 +404,17 @@
           </template>
 
           <template #cell-status="{ value }">
-            <span :class="['badge', value === 'active' ? 'badge-success' : 'badge-danger']">
-              {{ value }}
-            </span>
+            <div class="flex items-center gap-1.5">
+              <span
+                :class="[
+                  'inline-block h-2 w-2 rounded-full',
+                  value === 'active' ? 'bg-green-500' : 'bg-red-500'
+                ]"
+              ></span>
+              <span class="text-sm text-gray-700 dark:text-gray-300">
+                {{ value === 'active' ? t('common.active') : t('admin.users.disabled') }}
+              </span>
+            </div>
           </template>
 
           <template #cell-created_at="{ value }">
@@ -471,15 +694,6 @@
             :placeholder="t('admin.users.enterUsername')"
           />
         </div>
-        <div>
-          <label class="input-label">{{ t('admin.users.wechat') }}</label>
-          <input
-            v-model="createForm.wechat"
-            type="text"
-            class="input"
-            :placeholder="t('admin.users.enterWechat')"
-          />
-        </div>
         <div>
           <label class="input-label">{{ t('admin.users.notes') }}</label>
           <textarea
@@ -640,15 +854,6 @@
             :placeholder="t('admin.users.enterUsername')"
           />
         </div>
-        <div>
-          <label class="input-label">{{ t('admin.users.wechat') }}</label>
-          <input
-            v-model="editForm.wechat"
-            type="text"
-            class="input"
-            :placeholder="t('admin.users.enterWechat')"
-          />
-        </div>
         <div>
           <label class="input-label">{{ t('admin.users.notes') }}</label>
           <textarea
@@ -664,6 +869,12 @@
           <input v-model.number="editForm.concurrency" type="number" class="input" />
         </div>
 
+        <!-- Custom Attributes -->
+        <UserAttributeForm
+          v-model="editForm.customAttributes"
+          :user-id="editingUser?.id"
+        />
+
       </form>
 
       <template #footer>
@@ -1179,6 +1390,12 @@
       @confirm="confirmDelete"
       @cancel="showDeleteDialog = false"
     />
+
+    <!-- User Attributes Config Modal -->
+    <UserAttributesConfigModal
+      :show="showAttributesModal"
+      @close="handleAttributesModalClose"
+    />
   </AppLayout>
 </template>
 
@@ -1191,7 +1408,7 @@ import { formatDateTime } from '@/utils/format'
 
 const { t } = useI18n()
 import { adminAPI } from '@/api/admin'
-import type { User, ApiKey, Group } from '@/types'
+import type { User, ApiKey, Group, UserAttributeValuesMap, UserAttributeDefinition } from '@/types'
 import type { BatchUserUsageStats } from '@/api/admin/dashboard'
 import type { Column } from '@/components/common/types'
 import AppLayout from '@/components/layout/AppLayout.vue'
@@ -1201,17 +1418,66 @@ import Pagination from '@/components/common/Pagination.vue'
 import BaseDialog from '@/components/common/BaseDialog.vue'
 import ConfirmDialog from '@/components/common/ConfirmDialog.vue'
 import EmptyState from '@/components/common/EmptyState.vue'
-import Select from '@/components/common/Select.vue'
 import GroupBadge from '@/components/common/GroupBadge.vue'
+import UserAttributesConfigModal from '@/components/user/UserAttributesConfigModal.vue'
+import UserAttributeForm from '@/components/user/UserAttributeForm.vue'
 
 const appStore = useAppStore()
 const { copyToClipboard: clipboardCopy } = useClipboard()
 
-const columns = computed<Column[]>(() => [
+// Generate dynamic attribute columns from enabled definitions
+const attributeColumns = computed<Column[]>(() =>
+  attributeDefinitions.value
+    .filter(def => def.enabled)
+    .map(def => ({
+      key: `attr_${def.id}`,
+      label: def.name,
+      sortable: false
+    }))
+)
+
+// Get formatted attribute value for display in table
+const getAttributeValue = (userId: number, attrId: number): string => {
+  const userAttrs = userAttributeValues.value[userId]
+  if (!userAttrs) return '-'
+  const value = userAttrs[attrId]
+  if (!value) return '-'
+
+  // Find definition for this attribute
+  const def = attributeDefinitions.value.find(d => d.id === attrId)
+  if (!def) return value
+
+  // Format based on type
+  if (def.type === 'multi_select' && value) {
+    try {
+      const arr = JSON.parse(value)
+      if (Array.isArray(arr)) {
+        // Map values to labels
+        return arr.map(v => {
+          const opt = def.options?.find(o => o.value === v)
+          return opt?.label || v
+        }).join(', ')
+      }
+    } catch {
+      return value
+    }
+  }
+
+  if (def.type === 'select' && value && def.options) {
+    const opt = def.options.find(o => o.value === value)
+    return opt?.label || value
+  }
+
+  return value
+}
+
+// All possible columns (for column settings)
+const allColumns = computed<Column[]>(() => [
   { key: 'email', label: t('admin.users.columns.user'), sortable: true },
   { key: 'username', label: t('admin.users.columns.username'), sortable: true },
-  { key: 'wechat', label: t('admin.users.columns.wechat'), sortable: false },
   { key: 'notes', label: t('admin.users.columns.notes'), sortable: false },
+  // Dynamic attribute columns
+  ...attributeColumns.value,
   { key: 'role', label: t('admin.users.columns.role'), sortable: true },
   { key: 'subscriptions', label: t('admin.users.columns.subscriptions'), sortable: false },
   { key: 'balance', label: t('admin.users.columns.balance'), sortable: true },
@@ -1222,27 +1488,154 @@ const columns = computed<Column[]>(() => [
   { key: 'actions', label: t('admin.users.columns.actions'), sortable: false }
 ])
 
-// Filter options
-const roleOptions = computed(() => [
-  { value: '', label: t('admin.users.allRoles') },
-  { value: 'admin', label: t('admin.users.admin') },
-  { value: 'user', label: t('admin.users.user') }
-])
+// Columns that can be toggled (exclude email and actions which are always visible)
+const toggleableColumns = computed(() =>
+  allColumns.value.filter(col => col.key !== 'email' && col.key !== 'actions')
+)
 
-const statusOptions = computed(() => [
-  { value: '', label: t('admin.users.allStatus') },
-  { value: 'active', label: t('common.active') },
-  { value: 'disabled', label: t('admin.users.disabled') }
-])
+// Hidden columns (stored in Set - columns NOT in this set are visible)
+// This way, new columns are visible by default
+const hiddenColumns = reactive<Set<string>>(new Set())
+
+// Default hidden columns (columns hidden by default on first load)
+const DEFAULT_HIDDEN_COLUMNS = ['notes', 'subscriptions', 'usage', 'concurrency']
+
+// localStorage key for column settings
+const HIDDEN_COLUMNS_KEY = 'user-hidden-columns'
+
+// Load saved column settings
+const loadSavedColumns = () => {
+  try {
+    const saved = localStorage.getItem(HIDDEN_COLUMNS_KEY)
+    if (saved) {
+      const parsed = JSON.parse(saved) as string[]
+      parsed.forEach(key => hiddenColumns.add(key))
+    } else {
+      // Use default hidden columns on first load
+      DEFAULT_HIDDEN_COLUMNS.forEach(key => hiddenColumns.add(key))
+    }
+  } catch (e) {
+    console.error('Failed to load saved columns:', e)
+    DEFAULT_HIDDEN_COLUMNS.forEach(key => hiddenColumns.add(key))
+  }
+}
+
+// Save column settings to localStorage
+const saveColumnsToStorage = () => {
+  try {
+    localStorage.setItem(HIDDEN_COLUMNS_KEY, JSON.stringify([...hiddenColumns]))
+  } catch (e) {
+    console.error('Failed to save columns:', e)
+  }
+}
+
+// Toggle column visibility
+const toggleColumn = (key: string) => {
+  if (hiddenColumns.has(key)) {
+    hiddenColumns.delete(key)
+  } else {
+    hiddenColumns.add(key)
+  }
+  saveColumnsToStorage()
+}
+
+// Check if column is visible (not in hidden set)
+const isColumnVisible = (key: string) => !hiddenColumns.has(key)
+
+// Filtered columns based on visibility
+const columns = computed<Column[]>(() =>
+  allColumns.value.filter(col =>
+    col.key === 'email' || col.key === 'actions' || !hiddenColumns.has(col.key)
+  )
+)
 
 const users = ref<User[]>([])
 const loading = ref(false)
 const searchQuery = ref('')
+
+// Filter values (role, status, and custom attributes)
 const filters = reactive({
   role: '',
   status: ''
 })
+const activeAttributeFilters = reactive<Record<number, string>>({})
+
+// Visible filters tracking (which filters are shown in the UI)
+// Keys: 'role', 'status', 'attr_${id}'
+const visibleFilters = reactive<Set<string>>(new Set())
+
+// Dropdown states
+const showFilterDropdown = ref(false)
+const showColumnDropdown = ref(false)
+
+// Dropdown refs for click outside detection
+const filterDropdownRef = ref<HTMLElement | null>(null)
+const columnDropdownRef = ref<HTMLElement | null>(null)
+
+// localStorage keys
+const FILTER_VALUES_KEY = 'user-filter-values'
+const VISIBLE_FILTERS_KEY = 'user-visible-filters'
+
+// All filterable attribute definitions (enabled attributes)
+const filterableAttributes = computed(() =>
+  attributeDefinitions.value.filter(def => def.enabled)
+)
+
+// Built-in filter definitions
+const builtInFilters = computed(() => [
+  { key: 'role', name: t('admin.users.columns.role'), type: 'select' as const },
+  { key: 'status', name: t('admin.users.columns.status'), type: 'select' as const }
+])
+
+// Load saved filters from localStorage
+const loadSavedFilters = () => {
+  try {
+    // Load visible filters
+    const savedVisible = localStorage.getItem(VISIBLE_FILTERS_KEY)
+    if (savedVisible) {
+      const parsed = JSON.parse(savedVisible) as string[]
+      parsed.forEach(key => visibleFilters.add(key))
+    }
+    // Load filter values
+    const savedValues = localStorage.getItem(FILTER_VALUES_KEY)
+    if (savedValues) {
+      const parsed = JSON.parse(savedValues)
+      if (parsed.role) filters.role = parsed.role
+      if (parsed.status) filters.status = parsed.status
+      if (parsed.attributes) {
+        Object.assign(activeAttributeFilters, parsed.attributes)
+      }
+    }
+  } catch (e) {
+    console.error('Failed to load saved filters:', e)
+  }
+}
+
+// Save filters to localStorage
+const saveFiltersToStorage = () => {
+  try {
+    // Save visible filters
+    localStorage.setItem(VISIBLE_FILTERS_KEY, JSON.stringify([...visibleFilters]))
+    // Save filter values
+    const values = {
+      role: filters.role,
+      status: filters.status,
+      attributes: activeAttributeFilters
+    }
+    localStorage.setItem(FILTER_VALUES_KEY, JSON.stringify(values))
+  } catch (e) {
+    console.error('Failed to save filters:', e)
+  }
+}
+
+// Get attribute definition by ID
+const getAttributeDefinition = (attrId: number): UserAttributeDefinition | undefined => {
+  return attributeDefinitions.value.find(d => d.id === attrId)
+}
 const usageStats = ref<Record<string, BatchUserUsageStats>>({})
+// User attribute definitions and values
+const attributeDefinitions = ref<UserAttributeDefinition[]>([])
+const userAttributeValues = ref<Record<number, Record<number, string>>>({})
 const pagination = reactive({
   page: 1,
   page_size: 20,
@@ -1254,6 +1647,7 @@ const showCreateModal = ref(false)
 const showEditModal = ref(false)
 const showDeleteDialog = ref(false)
 const showApiKeysModal = ref(false)
+const showAttributesModal = ref(false)
 const submitting = ref(false)
 const editingUser = ref<User | null>(null)
 const deletingUser = ref<User | null>(null)
@@ -1317,6 +1711,14 @@ const handleClickOutside = (event: MouseEvent) => {
   if (!target.closest('.action-menu-trigger') && !target.closest('.action-menu-content')) {
     closeActionMenu()
   }
+  // Close filter dropdown when clicking outside
+  if (filterDropdownRef.value && !filterDropdownRef.value.contains(target)) {
+    showFilterDropdown.value = false
+  }
+  // Close column dropdown when clicking outside
+  if (columnDropdownRef.value && !columnDropdownRef.value.contains(target)) {
+    showColumnDropdown.value = false
+  }
 }
 
 // Allowed groups modal state
@@ -1341,7 +1743,6 @@ const createForm = reactive({
   email: '',
   password: '',
   username: '',
-  wechat: '',
   notes: '',
   balance: 0,
   concurrency: 1
@@ -1351,9 +1752,9 @@ const editForm = reactive({
   email: '',
   password: '',
   username: '',
-  wechat: '',
   notes: '',
-  concurrency: 1
+  concurrency: 1,
+  customAttributes: {} as UserAttributeValuesMap
 })
 const editPasswordCopied = ref(false)
 
@@ -1404,6 +1805,21 @@ const copyEditPassword = async () => {
   }
 }
 
+const loadAttributeDefinitions = async () => {
+  try {
+    attributeDefinitions.value = await adminAPI.userAttributes.listEnabledDefinitions()
+  } catch (e) {
+    console.error('Failed to load attribute definitions:', e)
+  }
+}
+
+// Handle attributes modal close - reload definitions and users
+const handleAttributesModalClose = async () => {
+  showAttributesModal.value = false
+  await loadAttributeDefinitions()
+  loadUsers()
+}
+
 const loadUsers = async () => {
   abortController?.abort()
   const currentAbortController = new AbortController()
@@ -1411,13 +1827,22 @@ const loadUsers = async () => {
   const { signal } = currentAbortController
   loading.value = true
   try {
+    // Build attribute filters from active filters
+    const attrFilters: Record<number, string> = {}
+    for (const [attrId, value] of Object.entries(activeAttributeFilters)) {
+      if (value) {
+        attrFilters[Number(attrId)] = value
+      }
+    }
+
     const response = await adminAPI.users.list(
       pagination.page,
       pagination.page_size,
       {
         role: filters.role as any,
         status: filters.status as any,
-        search: searchQuery.value || undefined
+        search: searchQuery.value || undefined,
+        attributes: Object.keys(attrFilters).length > 0 ? attrFilters : undefined
       },
       { signal }
     )
@@ -1428,9 +1853,10 @@ const loadUsers = async () => {
     pagination.total = response.total
     pagination.pages = response.pages
 
-    // Load usage stats for all users in the list
+    // Load usage stats and attribute values for all users in the list
     if (response.items.length > 0) {
       const userIds = response.items.map((u) => u.id)
+      // Load usage stats
       try {
         const usageResponse = await adminAPI.dashboard.getBatchUsersUsage(userIds)
         if (signal.aborted) {
@@ -1443,6 +1869,21 @@ const loadUsers = async () => {
         }
         console.error('Failed to load usage stats:', e)
       }
+      // Load attribute values
+      if (attributeDefinitions.value.length > 0) {
+        try {
+          const attrResponse = await adminAPI.userAttributes.getBatchUserAttributes(userIds)
+          if (signal.aborted) {
+            return
+          }
+          userAttributeValues.value = attrResponse.attributes
+        } catch (e) {
+          if (signal.aborted) {
+            return
+          }
+          console.error('Failed to load user attribute values:', e)
+        }
+      }
     }
   } catch (error) {
     const errorInfo = error as { name?: string; code?: string }
@@ -1478,12 +1919,54 @@ const handlePageSizeChange = (pageSize: number) => {
   loadUsers()
 }
 
+// Filter helpers
+const getAttributeDefinitionName = (attrId: number): string => {
+  const def = attributeDefinitions.value.find(d => d.id === attrId)
+  return def?.name || String(attrId)
+}
+
+// Toggle a built-in filter (role/status)
+const toggleBuiltInFilter = (key: string) => {
+  if (visibleFilters.has(key)) {
+    visibleFilters.delete(key)
+    if (key === 'role') filters.role = ''
+    if (key === 'status') filters.status = ''
+  } else {
+    visibleFilters.add(key)
+  }
+  saveFiltersToStorage()
+  loadUsers()
+}
+
+// Toggle a custom attribute filter
+const toggleAttributeFilter = (attr: UserAttributeDefinition) => {
+  const key = `attr_${attr.id}`
+  if (visibleFilters.has(key)) {
+    visibleFilters.delete(key)
+    delete activeAttributeFilters[attr.id]
+  } else {
+    visibleFilters.add(key)
+    activeAttributeFilters[attr.id] = ''
+  }
+  saveFiltersToStorage()
+  loadUsers()
+}
+
+const updateAttributeFilter = (attrId: number, value: string) => {
+  activeAttributeFilters[attrId] = value
+}
+
+// Apply filter and save to localStorage
+const applyFilter = () => {
+  saveFiltersToStorage()
+  loadUsers()
+}
+
 const closeCreateModal = () => {
   showCreateModal.value = false
   createForm.email = ''
   createForm.password = ''
   createForm.username = ''
-  createForm.wechat = ''
   createForm.notes = ''
   createForm.balance = 0
   createForm.concurrency = 1
@@ -1514,9 +1997,9 @@ const handleEdit = (user: User) => {
   editForm.email = user.email
   editForm.password = ''
   editForm.username = user.username || ''
-  editForm.wechat = user.wechat || ''
   editForm.notes = user.notes || ''
   editForm.concurrency = user.concurrency
+  editForm.customAttributes = {}
   editPasswordCopied.value = false
   showEditModal.value = true
 }
@@ -1525,6 +2008,7 @@ const closeEditModal = () => {
   showEditModal.value = false
   editingUser.value = null
   editForm.password = ''
+  editForm.customAttributes = {}
   editPasswordCopied.value = false
 }
 
@@ -1536,7 +2020,6 @@ const handleUpdateUser = async () => {
     const updateData: Record<string, any> = {
       email: editForm.email,
       username: editForm.username,
-      wechat: editForm.wechat,
       notes: editForm.notes,
       concurrency: editForm.concurrency
     }
@@ -1545,6 +2028,15 @@ const handleUpdateUser = async () => {
     }
 
     await adminAPI.users.update(editingUser.value.id, updateData)
+
+    // Save custom attributes if any
+    if (Object.keys(editForm.customAttributes).length > 0) {
+      await adminAPI.userAttributes.updateUserAttributeValues(
+        editingUser.value.id,
+        editForm.customAttributes
+      )
+    }
+
     appStore.showSuccess(t('admin.users.userUpdated'))
     closeEditModal()
     loadUsers()
@@ -1730,7 +2222,10 @@ const handleBalanceSubmit = async () => {
   }
 }
 
-onMounted(() => {
+onMounted(async () => {
+  await loadAttributeDefinitions()
+  loadSavedFilters()
+  loadSavedColumns()
   loadUsers()
   document.addEventListener('click', handleClickOutside)
 })

frontend/src/views/user/KeysView.vue

@@ -173,7 +173,7 @@
               </button>
               <!-- Import to CC Switch Button -->
               <button
-                @click="importToCcswitch(row.key)"
+                @click="importToCcswitch(row)"
                 class="flex flex-col items-center gap-0.5 rounded-lg p-1.5 text-gray-500 transition-colors hover:bg-blue-50 hover:text-blue-600 dark:hover:bg-blue-900/20 dark:hover:text-blue-400"
               >
                 <svg
@@ -453,6 +453,49 @@
       @close="closeUseKeyModal"
     />
 
+    <!-- CCS Client Selection Dialog for Antigravity -->
+    <BaseDialog
+      :show="showCcsClientSelect"
+      :title="t('keys.ccsClientSelect.title')"
+      width="narrow"
+      @close="closeCcsClientSelect"
+    >
+      <div class="space-y-4">
+        <p class="text-sm text-gray-600 dark:text-gray-400">
+          {{ t('keys.ccsClientSelect.description') }}
+        </p>
+        <div class="grid grid-cols-2 gap-3">
+          <button
+            @click="handleCcsClientSelect('claude')"
+            class="flex flex-col items-center gap-2 p-4 rounded-xl border-2 border-gray-200 dark:border-dark-600 hover:border-primary-500 dark:hover:border-primary-500 hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-all"
+          >
+            <svg class="w-8 h-8 text-gray-600 dark:text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5">
+              <path stroke-linecap="round" stroke-linejoin="round" d="m6.75 7.5 3 2.25-3 2.25m4.5 0h3m-9 8.25h13.5A2.25 2.25 0 0 0 21 17.25V6.75A2.25 2.25 0 0 0 18.75 4.5H5.25A2.25 2.25 0 0 0 3 6.75v10.5A2.25 2.25 0 0 0 5.25 20.25Z" />
+            </svg>
+            <span class="font-medium text-gray-900 dark:text-white">{{ t('keys.ccsClientSelect.claudeCode') }}</span>
+            <span class="text-xs text-gray-500 dark:text-gray-400">{{ t('keys.ccsClientSelect.claudeCodeDesc') }}</span>
+          </button>
+          <button
+            @click="handleCcsClientSelect('gemini')"
+            class="flex flex-col items-center gap-2 p-4 rounded-xl border-2 border-gray-200 dark:border-dark-600 hover:border-primary-500 dark:hover:border-primary-500 hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-all"
+          >
+            <svg class="w-8 h-8 text-gray-600 dark:text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.894 20.567 16.5 21.75l-.394-1.183a2.25 2.25 0 0 0-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 0 0 1.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 0 0 1.423 1.423l1.183.394-1.183.394a2.25 2.25 0 0 0-1.423 1.423Z" />
+            </svg>
+            <span class="font-medium text-gray-900 dark:text-white">{{ t('keys.ccsClientSelect.geminiCli') }}</span>
+            <span class="text-xs text-gray-500 dark:text-gray-400">{{ t('keys.ccsClientSelect.geminiCliDesc') }}</span>
+          </button>
+        </div>
+      </div>
+      <template #footer>
+        <div class="flex justify-end">
+          <button @click="closeCcsClientSelect" class="btn btn-secondary">
+            {{ t('common.cancel') }}
+          </button>
+        </div>
+      </template>
+    </BaseDialog>
+
     <!-- Group Selector Dropdown (Teleported to body to avoid overflow clipping) -->
     <Teleport to="body">
       <div
@@ -563,6 +606,8 @@ const showCreateModal = ref(false)
 const showEditModal = ref(false)
 const showDeleteDialog = ref(false)
 const showUseKeyModal = ref(false)
+const showCcsClientSelect = ref(false)
+const pendingCcsRow = ref<ApiKey | null>(null)
 const selectedKey = ref<ApiKey | null>(null)
 const copiedKeyId = ref<number | null>(null)
 const groupSelectorKeyId = ref<number | null>(null)
@@ -871,8 +916,48 @@ const closeModals = () => {
   }
 }
 
-const importToCcswitch = (apiKey: string) => {
+const importToCcswitch = (row: ApiKey) => {
+  const platform = row.group?.platform || 'anthropic'
+
+  // For antigravity platform, show client selection dialog
+  if (platform === 'antigravity') {
+    pendingCcsRow.value = row
+    showCcsClientSelect.value = true
+    return
+  }
+
+  // For other platforms, execute directly
+  executeCcsImport(row, platform === 'gemini' ? 'gemini' : 'claude')
+}
+
+const executeCcsImport = (row: ApiKey, clientType: 'claude' | 'gemini') => {
   const baseUrl = publicSettings.value?.api_base_url || window.location.origin
+  const platform = row.group?.platform || 'anthropic'
+
+  // Determine app name and endpoint based on platform and client type
+  let app: string
+  let endpoint: string
+
+  if (platform === 'antigravity') {
+    // Antigravity always uses /antigravity suffix
+    app = clientType === 'gemini' ? 'gemini' : 'claude'
+    endpoint = `${baseUrl}/antigravity`
+  } else {
+    switch (platform) {
+      case 'openai':
+        app = 'codex'
+        endpoint = baseUrl
+        break
+      case 'gemini':
+        app = 'gemini'
+        endpoint = baseUrl
+        break
+      default: // anthropic
+        app = 'claude'
+        endpoint = baseUrl
+    }
+  }
+
   const usageScript = `({
     request: {
       url: "{{baseUrl}}/v1/usage",
@@ -889,11 +974,11 @@ const importToCcswitch = (apiKey: string) => {
   })`
   const params = new URLSearchParams({
     resource: 'provider',
-    app: 'claude',
+    app: app,
     name: 'sub2api',
     homepage: baseUrl,
-    endpoint: baseUrl,
-    apiKey: apiKey,
+    endpoint: endpoint,
+    apiKey: row.key,
     configFormat: 'json',
     usageEnabled: 'true',
     usageScript: btoa(usageScript),
@@ -916,6 +1001,19 @@ const importToCcswitch = (apiKey: string) => {
   }
 }
 
+const handleCcsClientSelect = (clientType: 'claude' | 'gemini') => {
+  if (pendingCcsRow.value) {
+    executeCcsImport(pendingCcsRow.value, clientType)
+  }
+  showCcsClientSelect.value = false
+  pendingCcsRow.value = null
+}
+
+const closeCcsClientSelect = () => {
+  showCcsClientSelect.value = false
+  pendingCcsRow.value = null
+}
+
 onMounted(() => {
   loadApiKeys()
   loadGroups()

frontend/src/views/user/ProfileView.vue

@@ -89,25 +89,6 @@
               </svg>
               <span class="truncate">{{ user.username }}</span>
             </div>
-            <div
-              v-if="user?.wechat"
-              class="flex items-center gap-3 text-sm text-gray-600 dark:text-gray-400"
-            >
-              <svg
-                class="h-4 w-4 text-gray-400 dark:text-gray-500"
-                fill="none"
-                viewBox="0 0 24 24"
-                stroke="currentColor"
-                stroke-width="1.5"
-              >
-                <path
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  d="M8.625 12a.375.375 0 11-.75 0 .375.375 0 01.75 0zm0 0H8.25m4.125 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zm0 0H12m4.125 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zm0 0h-.375M21 12c0 4.556-4.03 8.25-9 8.25a9.764 9.764 0 01-2.555-.337A5.972 5.972 0 015.41 20.97a5.969 5.969 0 01-.474-.065 4.48 4.48 0 00.978-2.025c.09-.457-.133-.901-.467-1.226C3.93 16.178 3 14.189 3 12c0-4.556 4.03-8.25 9-8.25s9 3.694 9 8.25z"
-                />
-              </svg>
-              <span class="truncate">{{ user.wechat }}</span>
-            </div>
           </div>
         </div>
       </div>
@@ -170,19 +151,6 @@
               />
             </div>
 
-            <div>
-              <label for="wechat" class="input-label">
-                {{ t('profile.wechat') }}
-              </label>
-              <input
-                id="wechat"
-                v-model="profileForm.wechat"
-                type="text"
-                class="input"
-                :placeholder="t('profile.enterWechat')"
-              />
-            </div>
-
             <div class="flex justify-end pt-4">
               <button type="submit" :disabled="updatingProfile" class="btn btn-primary">
                 {{ updatingProfile ? t('profile.updating') : t('profile.updateProfile') }}
@@ -338,8 +306,7 @@ const passwordForm = ref({
 })
 
 const profileForm = ref({
-  username: '',
-  wechat: ''
+  username: ''
 })
 
 const changingPassword = ref(false)
@@ -354,7 +321,6 @@ onMounted(async () => {
     // Initialize profile form with current user data
     if (user.value) {
       profileForm.value.username = user.value.username || ''
-      profileForm.value.wechat = user.value.wechat || ''
     }
   } catch (error) {
     console.error('Failed to load contact info:', error)
@@ -407,8 +373,7 @@ const handleUpdateProfile = async () => {
   updatingProfile.value = true
   try {
     const updatedUser = await userAPI.updateProfile({
-      username: profileForm.value.username,
-      wechat: profileForm.value.wechat
+      username: profileForm.value.username
     })
 
     // Update auth store with new user data

frontend/src/views/user/SubscriptionsView.vue

@@ -230,18 +230,26 @@
               </p>
             </div>
 
-            <!-- No limits configured -->
+            <!-- No limits configured - Unlimited badge -->
             <div
               v-if="
                 !subscription.group?.daily_limit_usd &&
                 !subscription.group?.weekly_limit_usd &&
                 !subscription.group?.monthly_limit_usd
               "
-              class="py-4 text-center"
+              class="flex items-center justify-center rounded-xl bg-gradient-to-r from-emerald-50 to-teal-50 py-6 dark:from-emerald-900/20 dark:to-teal-900/20"
             >
-              <span class="text-sm text-gray-500 dark:text-dark-400">{{
-                t('userSubscriptions.unlimited')
-              }}</span>
+              <div class="flex items-center gap-3">
+                <span class="text-4xl text-emerald-600 dark:text-emerald-400">∞</span>
+                <div>
+                  <p class="text-sm font-medium text-emerald-700 dark:text-emerald-300">
+                    {{ t('userSubscriptions.unlimited') }}
+                  </p>
+                  <p class="text-xs text-emerald-600/70 dark:text-emerald-400/70">
+                    {{ t('userSubscriptions.unlimitedDesc') }}
+                  </p>
+                </div>
+              </div>
             </div>
           </div>
         </div>