diff --git a/.gitignore b/.gitignore
index 10594f73..e4c9e9c1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -26,6 +26,7 @@ redis_data/
 
 # Logs directory
 logs/
+logs1/
 *.log
 startup.log
 app.log
diff --git a/VERSION b/VERSION
index 2f3faf60..80f39145 100644
--- a/VERSION
+++ b/VERSION
@@ -1 +1 @@
-1.1.221
+1.1.224
diff --git a/package-lock.json b/package-lock.json
index 039664e6..c6dccd11 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -44,6 +44,7 @@
         "jest": "^29.7.0",
         "nodemon": "^3.0.1",
         "prettier": "^3.6.2",
+        "prettier-plugin-tailwindcss": "^0.7.2",
         "supertest": "^6.3.3"
       },
       "engines": {
@@ -890,6 +891,7 @@
       "integrity": "sha512-2BCOP7TN8M+gVDj7/ht3hsaO/B/n5oDbiAyyvnRlNOs+u1o+JWNYTQrmpuNp1/Wq2gcFrI01JAW+paEKDMx/CA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.3",
@@ -2998,6 +3000,7 @@
       "integrity": "sha512-yCAeZl7a0DxgNVteXFHt9+uyFbqXGy/ShC4BlcHkoE0AfGXYv/BUiplV72DjMYXHDBXFjhvr6DD1NiRVfB4j8g==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "undici-types": "~6.21.0"
       }
@@ -3079,6 +3082,7 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -3534,6 +3538,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "caniuse-lite": "^1.0.30001737",
         "electron-to-chromium": "^1.5.211",
@@ -4421,6 +4426,7 @@
       "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -4477,6 +4483,7 @@
       "integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "eslint-config-prettier": "bin/cli.js"
       },
@@ -7575,6 +7582,7 @@
       "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "prettier": "bin/prettier.cjs"
       },
@@ -7598,6 +7606,85 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/prettier-plugin-tailwindcss": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.7.2.tgz",
+      "integrity": "sha512-LkphyK3Fw+q2HdMOoiEHWf93fNtYJwfamoKPl7UwtjFQdei/iIBoX11G6j706FzN3ymX9mPVi97qIY8328vdnA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19"
+      },
+      "peerDependencies": {
+        "@ianvs/prettier-plugin-sort-imports": "*",
+        "@prettier/plugin-hermes": "*",
+        "@prettier/plugin-oxc": "*",
+        "@prettier/plugin-pug": "*",
+        "@shopify/prettier-plugin-liquid": "*",
+        "@trivago/prettier-plugin-sort-imports": "*",
+        "@zackad/prettier-plugin-twig": "*",
+        "prettier": "^3.0",
+        "prettier-plugin-astro": "*",
+        "prettier-plugin-css-order": "*",
+        "prettier-plugin-jsdoc": "*",
+        "prettier-plugin-marko": "*",
+        "prettier-plugin-multiline-arrays": "*",
+        "prettier-plugin-organize-attributes": "*",
+        "prettier-plugin-organize-imports": "*",
+        "prettier-plugin-sort-imports": "*",
+        "prettier-plugin-svelte": "*"
+      },
+      "peerDependenciesMeta": {
+        "@ianvs/prettier-plugin-sort-imports": {
+          "optional": true
+        },
+        "@prettier/plugin-hermes": {
+          "optional": true
+        },
+        "@prettier/plugin-oxc": {
+          "optional": true
+        },
+        "@prettier/plugin-pug": {
+          "optional": true
+        },
+        "@shopify/prettier-plugin-liquid": {
+          "optional": true
+        },
+        "@trivago/prettier-plugin-sort-imports": {
+          "optional": true
+        },
+        "@zackad/prettier-plugin-twig": {
+          "optional": true
+        },
+        "prettier-plugin-astro": {
+          "optional": true
+        },
+        "prettier-plugin-css-order": {
+          "optional": true
+        },
+        "prettier-plugin-jsdoc": {
+          "optional": true
+        },
+        "prettier-plugin-marko": {
+          "optional": true
+        },
+        "prettier-plugin-multiline-arrays": {
+          "optional": true
+        },
+        "prettier-plugin-organize-attributes": {
+          "optional": true
+        },
+        "prettier-plugin-organize-imports": {
+          "optional": true
+        },
+        "prettier-plugin-sort-imports": {
+          "optional": true
+        },
+        "prettier-plugin-svelte": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/pretty-format": {
       "version": "29.7.0",
       "resolved": "https://registry.npmmirror.com/pretty-format/-/pretty-format-29.7.0.tgz",
@@ -9014,6 +9101,7 @@
       "resolved": "https://registry.npmmirror.com/winston/-/winston-3.17.0.tgz",
       "integrity": "sha512-DLiFIXYC5fMPxaRg832S6F5mJYvePtmO5G9v9IgUFPhXm9/GkXarH/TUrBAVzhTCzAj9anE/+GjrgXp/54nOgw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@colors/colors": "^1.6.0",
         "@dabh/diagnostics": "^2.0.2",
diff --git a/package.json b/package.json
index 72ea4720..2b7ffa25 100644
--- a/package.json
+++ b/package.json
@@ -83,6 +83,7 @@
     "jest": "^29.7.0",
     "nodemon": "^3.0.1",
     "prettier": "^3.6.2",
+    "prettier-plugin-tailwindcss": "^0.7.2",
     "supertest": "^6.3.3"
   },
   "engines": {
diff --git a/scripts/test-official-models.js b/scripts/test-official-models.js
new file mode 100644
index 00000000..d87953fa
--- /dev/null
+++ b/scripts/test-official-models.js
@@ -0,0 +1,108 @@
+#!/usr/bin/env node
+/**
+ * 官方模型版本识别测试 - 最终版 v2
+ */
+
+const { isOpus45OrNewer } = require('../src/utils/modelHelper')
+
+// 官方模型
+const officialModels = [
+  { name: 'claude-3-opus-20240229', desc: 'Opus 3 (已弃用)', expectPro: false },
+  { name: 'claude-opus-4-20250514', desc: 'Opus 4.0', expectPro: false },
+  { name: 'claude-opus-4-1-20250805', desc: 'Opus 4.1', expectPro: false },
+  { name: 'claude-opus-4-5-20251101', desc: 'Opus 4.5', expectPro: true }
+]
+
+// 非 Opus 模型
+const nonOpusModels = [
+  { name: 'claude-sonnet-4-20250514', desc: 'Sonnet 4' },
+  { name: 'claude-sonnet-4-5-20250929', desc: 'Sonnet 4.5' },
+  { name: 'claude-haiku-4-5-20251001', desc: 'Haiku 4.5' },
+  { name: 'claude-3-5-haiku-20241022', desc: 'Haiku 3.5' },
+  { name: 'claude-3-haiku-20240307', desc: 'Haiku 3' },
+  { name: 'claude-3-7-sonnet-20250219', desc: 'Sonnet 3.7 (已弃用)' }
+]
+
+// 其他格式测试
+const otherFormats = [
+  { name: 'claude-opus-4.5', expected: true, desc: 'Opus 4.5 点分隔' },
+  { name: 'claude-opus-4-5', expected: true, desc: 'Opus 4.5 横线分隔' },
+  { name: 'opus-4.5', expected: true, desc: 'Opus 4.5 无前缀' },
+  { name: 'opus-4-5', expected: true, desc: 'Opus 4-5 无前缀' },
+  { name: 'opus-latest', expected: true, desc: 'Opus latest' },
+  { name: 'claude-opus-5', expected: true, desc: 'Opus 5 (未来)' },
+  { name: 'claude-opus-5-0', expected: true, desc: 'Opus 5.0 (未来)' },
+  { name: 'opus-4.0', expected: false, desc: 'Opus 4.0' },
+  { name: 'opus-4.1', expected: false, desc: 'Opus 4.1' },
+  { name: 'opus-4.4', expected: false, desc: 'Opus 4.4' },
+  { name: 'opus-4', expected: false, desc: 'Opus 4' },
+  { name: 'opus-4-0', expected: false, desc: 'Opus 4-0' },
+  { name: 'opus-4-1', expected: false, desc: 'Opus 4-1' },
+  { name: 'opus-4-4', expected: false, desc: 'Opus 4-4' },
+  { name: 'opus', expected: false, desc: '仅 opus' },
+  { name: null, expected: false, desc: 'null' },
+  { name: '', expected: false, desc: '空字符串' }
+]
+
+console.log('='.repeat(90))
+console.log('官方模型版本识别测试 - 最终版 v2')
+console.log('='.repeat(90))
+console.log()
+
+let passed = 0
+let failed = 0
+
+// 测试官方 Opus 模型
+console.log('📌 官方 Opus 模型:')
+for (const m of officialModels) {
+  const result = isOpus45OrNewer(m.name)
+  const status = result === m.expectPro ? '✅ PASS' : '❌ FAIL'
+  if (result === m.expectPro) {
+    passed++
+  } else {
+    failed++
+  }
+  const proSupport = result ? 'Pro 可用 ✅' : 'Pro 不可用 ❌'
+  console.log(`  ${status} | ${m.name.padEnd(32)} | ${m.desc.padEnd(18)} | ${proSupport}`)
+}
+
+console.log()
+console.log('📌 非 Opus 模型 (不受此函数影响):')
+for (const m of nonOpusModels) {
+  const result = isOpus45OrNewer(m.name)
+  console.log(
+    `  ➖      | ${m.name.padEnd(32)} | ${m.desc.padEnd(18)} | ${result ? '⚠️ 异常' : '正确跳过'}`
+  )
+  if (result) {
+    failed++ // 非 Opus 模型不应返回 true
+  }
+}
+
+console.log()
+console.log('📌 其他格式测试:')
+for (const m of otherFormats) {
+  const result = isOpus45OrNewer(m.name)
+  const status = result === m.expected ? '✅ PASS' : '❌ FAIL'
+  if (result === m.expected) {
+    passed++
+  } else {
+    failed++
+  }
+  const display = m.name === null ? 'null' : m.name === '' ? '""' : m.name
+  console.log(
+    `  ${status} | ${display.padEnd(25)} | ${m.desc.padEnd(18)} | ${result ? 'Pro 可用' : 'Pro 不可用'}`
+  )
+}
+
+console.log()
+console.log('='.repeat(90))
+console.log('测试结果:', passed, '通过,', failed, '失败')
+console.log('='.repeat(90))
+
+if (failed > 0) {
+  console.log('\n❌ 有测试失败，请检查函数逻辑')
+  process.exit(1)
+} else {
+  console.log('\n✅ 所有测试通过！函数可以安全使用')
+  process.exit(0)
+}
diff --git a/src/handlers/geminiHandlers.js b/src/handlers/geminiHandlers.js
index cfdf35e0..87295d31 100644
--- a/src/handlers/geminiHandlers.js
+++ b/src/handlers/geminiHandlers.js
@@ -449,9 +449,8 @@ async function handleMessages(req, res) {
 
       // 添加代理配置
       if (proxyConfig) {
-        const proxyHelper = new ProxyHelper()
-        axiosConfig.httpsAgent = proxyHelper.createProxyAgent(proxyConfig)
-        axiosConfig.httpAgent = proxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpsAgent = ProxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpAgent = ProxyHelper.createProxyAgent(proxyConfig)
       }
 
       try {
@@ -732,9 +731,8 @@ async function handleModels(req, res) {
           headers: { 'Content-Type': 'application/json' }
         }
         if (proxyConfig) {
-          const proxyHelper = new ProxyHelper()
-          axiosConfig.httpsAgent = proxyHelper.createProxyAgent(proxyConfig)
-          axiosConfig.httpAgent = proxyHelper.createProxyAgent(proxyConfig)
+          axiosConfig.httpsAgent = ProxyHelper.createProxyAgent(proxyConfig)
+          axiosConfig.httpAgent = ProxyHelper.createProxyAgent(proxyConfig)
         }
         const response = await axios(axiosConfig)
         models = (response.data.models || []).map((m) => ({
@@ -1234,9 +1232,8 @@ async function handleCountTokens(req, res) {
       }
 
       if (proxyConfig) {
-        const proxyHelper = new ProxyHelper()
-        axiosConfig.httpsAgent = proxyHelper.createProxyAgent(proxyConfig)
-        axiosConfig.httpAgent = proxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpsAgent = ProxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpAgent = ProxyHelper.createProxyAgent(proxyConfig)
       }
 
       try {
@@ -1963,9 +1960,8 @@ async function handleStandardGenerateContent(req, res) {
       }
 
       if (proxyConfig) {
-        const proxyHelper = new ProxyHelper()
-        axiosConfig.httpsAgent = proxyHelper.createProxyAgent(proxyConfig)
-        axiosConfig.httpAgent = proxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpsAgent = ProxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpAgent = ProxyHelper.createProxyAgent(proxyConfig)
       }
 
       try {
@@ -2246,9 +2242,8 @@ async function handleStandardStreamGenerateContent(req, res) {
       }
 
       if (proxyConfig) {
-        const proxyHelper = new ProxyHelper()
-        axiosConfig.httpsAgent = proxyHelper.createProxyAgent(proxyConfig)
-        axiosConfig.httpAgent = proxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpsAgent = ProxyHelper.createProxyAgent(proxyConfig)
+        axiosConfig.httpAgent = ProxyHelper.createProxyAgent(proxyConfig)
       }
 
       try {
diff --git a/src/middleware/auth.js b/src/middleware/auth.js
index c39655e0..9c34fd5e 100644
--- a/src/middleware/auth.js
+++ b/src/middleware/auth.js
@@ -226,8 +226,18 @@ const authenticateApiKey = async (req, res, next) => {
       )
 
       if (currentConcurrency > concurrencyLimit) {
-        // 如果超过限制，立即减少计数
-        await redis.decrConcurrency(validation.keyData.id, requestId)
+        // 如果超过限制，立即减少计数（添加 try-catch 防止异常导致并发泄漏）
+        try {
+          const newCount = await redis.decrConcurrency(validation.keyData.id, requestId)
+          logger.api(
+            `📉 Decremented concurrency (429 rejected) for key: ${validation.keyData.id} (${validation.keyData.name}), new count: ${newCount}`
+          )
+        } catch (error) {
+          logger.error(
+            `Failed to decrement concurrency after limit exceeded for key ${validation.keyData.id}:`,
+            error
+          )
+        }
         logger.security(
           `🚦 Concurrency limit exceeded for key: ${validation.keyData.id} (${
             validation.keyData.name
@@ -249,7 +259,38 @@ const authenticateApiKey = async (req, res, next) => {
       let leaseRenewInterval = null
 
       if (renewIntervalMs > 0) {
+        // 🔴 关键修复：添加最大刷新次数限制，防止租约永不过期
+        // 默认最大生存时间为 10 分钟，可通过环境变量配置
+        const maxLifetimeMinutes = parseInt(process.env.CONCURRENCY_MAX_LIFETIME_MINUTES) || 10
+        const maxRefreshCount = Math.ceil((maxLifetimeMinutes * 60 * 1000) / renewIntervalMs)
+        let refreshCount = 0
+
         leaseRenewInterval = setInterval(() => {
+          refreshCount++
+
+          // 超过最大刷新次数，强制停止并清理
+          if (refreshCount > maxRefreshCount) {
+            logger.warn(
+              `⚠️ Lease refresh exceeded max count (${maxRefreshCount}) for key ${validation.keyData.id} (${validation.keyData.name}), forcing cleanup after ${maxLifetimeMinutes} minutes`
+            )
+            // 清理定时器
+            if (leaseRenewInterval) {
+              clearInterval(leaseRenewInterval)
+              leaseRenewInterval = null
+            }
+            // 强制减少并发计数（如果还没减少）
+            if (!concurrencyDecremented) {
+              concurrencyDecremented = true
+              redis.decrConcurrency(validation.keyData.id, requestId).catch((error) => {
+                logger.error(
+                  `Failed to decrement concurrency after max refresh for key ${validation.keyData.id}:`,
+                  error
+                )
+              })
+            }
+            return
+          }
+
           redis
             .refreshConcurrencyLease(validation.keyData.id, requestId, leaseSeconds)
             .catch((error) => {
diff --git a/src/models/redis.js b/src/models/redis.js
index 10f10e7a..2393f3b3 100644
--- a/src/models/redis.js
+++ b/src/models/redis.js
@@ -284,7 +284,8 @@ class RedisClient {
       isActive = '',
       sortBy = 'createdAt',
       sortOrder = 'desc',
-      excludeDeleted = true // 默认排除已删除的 API Keys
+      excludeDeleted = true, // 默认排除已删除的 API Keys
+      modelFilter = []
     } = options
 
     // 1. 使用 SCAN 获取所有 apikey:* 的 ID 列表（避免阻塞）
@@ -332,6 +333,15 @@ class RedisClient {
       }
     }
 
+    // 模型筛选
+    if (modelFilter.length > 0) {
+      const keyIdsWithModels = await this.getKeyIdsWithModels(
+        filteredKeys.map((k) => k.id),
+        modelFilter
+      )
+      filteredKeys = filteredKeys.filter((k) => keyIdsWithModels.has(k.id))
+    }
+
     // 4. 排序
     filteredKeys.sort((a, b) => {
       // status 排序实际上使用 isActive 字段（API Key 没有 status 字段）
@@ -781,6 +791,58 @@ class RedisClient {
     await Promise.all(operations)
   }
 
+  /**
+   * 获取使用了指定模型的 Key IDs（OR 逻辑）
+   */
+  async getKeyIdsWithModels(keyIds, models) {
+    if (!keyIds.length || !models.length) {
+      return new Set()
+    }
+
+    const client = this.getClientSafe()
+    const result = new Set()
+
+    // 批量检查每个 keyId 是否使用过任意一个指定模型
+    for (const keyId of keyIds) {
+      for (const model of models) {
+        // 检查是否有该模型的使用记录（daily 或 monthly）
+        const pattern = `usage:${keyId}:model:*:${model}:*`
+        const keys = await client.keys(pattern)
+        if (keys.length > 0) {
+          result.add(keyId)
+          break // 找到一个就够了（OR 逻辑）
+        }
+      }
+    }
+
+    return result
+  }
+
+  /**
+   * 获取所有被使用过的模型列表
+   */
+  async getAllUsedModels() {
+    const client = this.getClientSafe()
+    const models = new Set()
+
+    // 扫描所有模型使用记录
+    const pattern = 'usage:*:model:daily:*'
+    let cursor = '0'
+    do {
+      const [nextCursor, keys] = await client.scan(cursor, 'MATCH', pattern, 'COUNT', 1000)
+      cursor = nextCursor
+      for (const key of keys) {
+        // 从 key 中提取模型名: usage:{keyId}:model:daily:{model}:{date}
+        const match = key.match(/usage:[^:]+:model:daily:([^:]+):/)
+        if (match) {
+          models.add(match[1])
+        }
+      }
+    } while (cursor !== '0')
+
+    return [...models].sort()
+  }
+
   async getUsageStats(keyId) {
     const totalKey = `usage:${keyId}`
     const today = getDateStringInTimezone()
@@ -2034,6 +2096,246 @@ class RedisClient {
     return await this.getConcurrency(compositeKey)
   }
 
+  // 🔧 并发管理方法（用于管理员手动清理）
+
+  /**
+   * 获取所有并发状态
+   * @returns {Promise<Array>} 并发状态列表
+   */
+  async getAllConcurrencyStatus() {
+    try {
+      const client = this.getClientSafe()
+      const keys = await client.keys('concurrency:*')
+      const now = Date.now()
+      const results = []
+
+      for (const key of keys) {
+        // 提取 apiKeyId（去掉 concurrency: 前缀）
+        const apiKeyId = key.replace('concurrency:', '')
+
+        // 获取所有成员和分数（过期时间）
+        const members = await client.zrangebyscore(key, now, '+inf', 'WITHSCORES')
+
+        // 解析成员和过期时间
+        const activeRequests = []
+        for (let i = 0; i < members.length; i += 2) {
+          const requestId = members[i]
+          const expireAt = parseInt(members[i + 1])
+          const remainingSeconds = Math.max(0, Math.round((expireAt - now) / 1000))
+          activeRequests.push({
+            requestId,
+            expireAt: new Date(expireAt).toISOString(),
+            remainingSeconds
+          })
+        }
+
+        // 获取过期的成员数量
+        const expiredCount = await client.zcount(key, '-inf', now)
+
+        results.push({
+          apiKeyId,
+          key,
+          activeCount: activeRequests.length,
+          expiredCount,
+          activeRequests
+        })
+      }
+
+      return results
+    } catch (error) {
+      logger.error('❌ Failed to get all concurrency status:', error)
+      throw error
+    }
+  }
+
+  /**
+   * 获取特定 API Key 的并发状态详情
+   * @param {string} apiKeyId - API Key ID
+   * @returns {Promise<Object>} 并发状态详情
+   */
+  async getConcurrencyStatus(apiKeyId) {
+    try {
+      const client = this.getClientSafe()
+      const key = `concurrency:${apiKeyId}`
+      const now = Date.now()
+
+      // 检查 key 是否存在
+      const exists = await client.exists(key)
+      if (!exists) {
+        return {
+          apiKeyId,
+          key,
+          activeCount: 0,
+          expiredCount: 0,
+          activeRequests: [],
+          exists: false
+        }
+      }
+
+      // 获取所有成员和分数
+      const allMembers = await client.zrange(key, 0, -1, 'WITHSCORES')
+
+      const activeRequests = []
+      const expiredRequests = []
+
+      for (let i = 0; i < allMembers.length; i += 2) {
+        const requestId = allMembers[i]
+        const expireAt = parseInt(allMembers[i + 1])
+        const remainingSeconds = Math.round((expireAt - now) / 1000)
+
+        const requestInfo = {
+          requestId,
+          expireAt: new Date(expireAt).toISOString(),
+          remainingSeconds
+        }
+
+        if (expireAt > now) {
+          activeRequests.push(requestInfo)
+        } else {
+          expiredRequests.push(requestInfo)
+        }
+      }
+
+      return {
+        apiKeyId,
+        key,
+        activeCount: activeRequests.length,
+        expiredCount: expiredRequests.length,
+        activeRequests,
+        expiredRequests,
+        exists: true
+      }
+    } catch (error) {
+      logger.error(`❌ Failed to get concurrency status for ${apiKeyId}:`, error)
+      throw error
+    }
+  }
+
+  /**
+   * 强制清理特定 API Key 的并发计数（忽略租约）
+   * @param {string} apiKeyId - API Key ID
+   * @returns {Promise<Object>} 清理结果
+   */
+  async forceClearConcurrency(apiKeyId) {
+    try {
+      const client = this.getClientSafe()
+      const key = `concurrency:${apiKeyId}`
+
+      // 获取清理前的状态
+      const beforeCount = await client.zcard(key)
+
+      // 删除整个 key
+      await client.del(key)
+
+      logger.warn(
+        `🧹 Force cleared concurrency for key ${apiKeyId}, removed ${beforeCount} entries`
+      )
+
+      return {
+        apiKeyId,
+        key,
+        clearedCount: beforeCount,
+        success: true
+      }
+    } catch (error) {
+      logger.error(`❌ Failed to force clear concurrency for ${apiKeyId}:`, error)
+      throw error
+    }
+  }
+
+  /**
+   * 强制清理所有并发计数
+   * @returns {Promise<Object>} 清理结果
+   */
+  async forceClearAllConcurrency() {
+    try {
+      const client = this.getClientSafe()
+      const keys = await client.keys('concurrency:*')
+
+      let totalCleared = 0
+      const clearedKeys = []
+
+      for (const key of keys) {
+        const count = await client.zcard(key)
+        await client.del(key)
+        totalCleared += count
+        clearedKeys.push({
+          key,
+          clearedCount: count
+        })
+      }
+
+      logger.warn(
+        `🧹 Force cleared all concurrency: ${keys.length} keys, ${totalCleared} total entries`
+      )
+
+      return {
+        keysCleared: keys.length,
+        totalEntriesCleared: totalCleared,
+        clearedKeys,
+        success: true
+      }
+    } catch (error) {
+      logger.error('❌ Failed to force clear all concurrency:', error)
+      throw error
+    }
+  }
+
+  /**
+   * 清理过期的并发条目（不影响活跃请求）
+   * @param {string} apiKeyId - API Key ID（可选，不传则清理所有）
+   * @returns {Promise<Object>} 清理结果
+   */
+  async cleanupExpiredConcurrency(apiKeyId = null) {
+    try {
+      const client = this.getClientSafe()
+      const now = Date.now()
+      let keys
+
+      if (apiKeyId) {
+        keys = [`concurrency:${apiKeyId}`]
+      } else {
+        keys = await client.keys('concurrency:*')
+      }
+
+      let totalCleaned = 0
+      const cleanedKeys = []
+
+      for (const key of keys) {
+        // 只清理过期的条目
+        const cleaned = await client.zremrangebyscore(key, '-inf', now)
+        if (cleaned > 0) {
+          totalCleaned += cleaned
+          cleanedKeys.push({
+            key,
+            cleanedCount: cleaned
+          })
+        }
+
+        // 如果 key 为空，删除它
+        const remaining = await client.zcard(key)
+        if (remaining === 0) {
+          await client.del(key)
+        }
+      }
+
+      logger.info(
+        `🧹 Cleaned up expired concurrency: ${totalCleaned} entries from ${cleanedKeys.length} keys`
+      )
+
+      return {
+        keysProcessed: keys.length,
+        keysCleaned: cleanedKeys.length,
+        totalEntriesCleaned: totalCleaned,
+        cleanedKeys,
+        success: true
+      }
+    } catch (error) {
+      logger.error('❌ Failed to cleanup expired concurrency:', error)
+      throw error
+    }
+  }
+
   // 🔧 Basic Redis operations wrapper methods for convenience
   async get(key) {
     const client = this.getClientSafe()
diff --git a/src/routes/admin/apiKeys.js b/src/routes/admin/apiKeys.js
index 3a45feb0..9a22cb50 100644
--- a/src/routes/admin/apiKeys.js
+++ b/src/routes/admin/apiKeys.js
@@ -103,6 +103,17 @@ router.get('/api-keys/:keyId/cost-debug', authenticateAdmin, async (req, res) =>
   }
 })
 
+// 获取所有被使用过的模型列表
+router.get('/api-keys/used-models', authenticateAdmin, async (req, res) => {
+  try {
+    const models = await redis.getAllUsedModels()
+    return res.json({ success: true, data: models })
+  } catch (error) {
+    logger.error('❌ Failed to get used models:', error)
+    return res.status(500).json({ error: 'Failed to get used models', message: error.message })
+  }
+})
+
 // 获取所有API Keys
 router.get('/api-keys', authenticateAdmin, async (req, res) => {
   try {
@@ -116,6 +127,7 @@ router.get('/api-keys', authenticateAdmin, async (req, res) => {
       // 筛选参数
       tag = '',
       isActive = '',
+      models = '', // 模型筛选（逗号分隔）
       // 排序参数
       sortBy = 'createdAt',
       sortOrder = 'desc',
@@ -127,6 +139,9 @@ router.get('/api-keys', authenticateAdmin, async (req, res) => {
       timeRange = 'all'
     } = req.query
 
+    // 解析模型筛选参数
+    const modelFilter = models ? models.split(',').filter((m) => m.trim()) : []
+
     // 验证分页参数
     const pageNum = Math.max(1, parseInt(page) || 1)
     const pageSizeNum = [10, 20, 50, 100].includes(parseInt(pageSize)) ? parseInt(pageSize) : 20
@@ -217,7 +232,8 @@ router.get('/api-keys', authenticateAdmin, async (req, res) => {
           search,
           searchMode,
           tag,
-          isActive
+          isActive,
+          modelFilter
         })
 
         costSortStatus = {
@@ -250,7 +266,8 @@ router.get('/api-keys', authenticateAdmin, async (req, res) => {
           search,
           searchMode,
           tag,
-          isActive
+          isActive,
+          modelFilter
         })
 
         costSortStatus.isRealTimeCalculation = false
@@ -265,7 +282,8 @@ router.get('/api-keys', authenticateAdmin, async (req, res) => {
         tag,
         isActive,
         sortBy: validSortBy,
-        sortOrder: validSortOrder
+        sortOrder: validSortOrder,
+        modelFilter
       })
     }
 
@@ -322,7 +340,17 @@ router.get('/api-keys', authenticateAdmin, async (req, res) => {
  * 使用预计算索引进行费用排序的分页查询
  */
 async function getApiKeysSortedByCostPrecomputed(options) {
-  const { page, pageSize, sortOrder, costTimeRange, search, searchMode, tag, isActive } = options
+  const {
+    page,
+    pageSize,
+    sortOrder,
+    costTimeRange,
+    search,
+    searchMode,
+    tag,
+    isActive,
+    modelFilter = []
+  } = options
   const costRankService = require('../../services/costRankService')
 
   // 1. 获取排序后的全量 keyId 列表
@@ -369,6 +397,15 @@ async function getApiKeysSortedByCostPrecomputed(options) {
     }
   }
 
+  // 模型筛选
+  if (modelFilter.length > 0) {
+    const keyIdsWithModels = await redis.getKeyIdsWithModels(
+      orderedKeys.map((k) => k.id),
+      modelFilter
+    )
+    orderedKeys = orderedKeys.filter((k) => keyIdsWithModels.has(k.id))
+  }
+
   // 5. 收集所有可用标签
   const allTags = new Set()
   for (const key of allKeys) {
@@ -411,8 +448,18 @@ async function getApiKeysSortedByCostPrecomputed(options) {
  * 使用实时计算进行 custom 时间范围的费用排序
  */
 async function getApiKeysSortedByCostCustom(options) {
-  const { page, pageSize, sortOrder, startDate, endDate, search, searchMode, tag, isActive } =
-    options
+  const {
+    page,
+    pageSize,
+    sortOrder,
+    startDate,
+    endDate,
+    search,
+    searchMode,
+    tag,
+    isActive,
+    modelFilter = []
+  } = options
   const costRankService = require('../../services/costRankService')
 
   // 1. 实时计算所有 Keys 的费用
@@ -427,9 +474,9 @@ async function getApiKeysSortedByCostCustom(options) {
   }
 
   // 2. 转换为数组并排序
-  const sortedEntries = [...costs.entries()].sort((a, b) => {
-    return sortOrder === 'desc' ? b[1] - a[1] : a[1] - b[1]
-  })
+  const sortedEntries = [...costs.entries()].sort((a, b) =>
+    sortOrder === 'desc' ? b[1] - a[1] : a[1] - b[1]
+  )
   const rankedKeyIds = sortedEntries.map(([keyId]) => keyId)
 
   // 3. 批量获取 API Key 基础数据
@@ -465,6 +512,15 @@ async function getApiKeysSortedByCostCustom(options) {
     }
   }
 
+  // 模型筛选
+  if (modelFilter.length > 0) {
+    const keyIdsWithModels = await redis.getKeyIdsWithModels(
+      orderedKeys.map((k) => k.id),
+      modelFilter
+    )
+    orderedKeys = orderedKeys.filter((k) => keyIdsWithModels.has(k.id))
+  }
+
   // 6. 收集所有可用标签
   const allTags = new Set()
   for (const key of allKeys) {
diff --git a/src/routes/admin/concurrency.js b/src/routes/admin/concurrency.js
new file mode 100644
index 00000000..80fee22c
--- /dev/null
+++ b/src/routes/admin/concurrency.js
@@ -0,0 +1,145 @@
+/**
+ * 并发管理 API 路由
+ * 提供并发状态查看和手动清理功能
+ */
+
+const express = require('express')
+const router = express.Router()
+const redis = require('../../models/redis')
+const logger = require('../../utils/logger')
+
+/**
+ * GET /admin/concurrency
+ * 获取所有并发状态
+ */
+router.get('/concurrency', async (req, res) => {
+  try {
+    const status = await redis.getAllConcurrencyStatus()
+
+    // 计算汇总统计
+    const summary = {
+      totalKeys: status.length,
+      totalActiveRequests: status.reduce((sum, s) => sum + s.activeCount, 0),
+      totalExpiredRequests: status.reduce((sum, s) => sum + s.expiredCount, 0)
+    }
+
+    res.json({
+      success: true,
+      summary,
+      concurrencyStatus: status
+    })
+  } catch (error) {
+    logger.error('❌ Failed to get concurrency status:', error)
+    res.status(500).json({
+      success: false,
+      error: 'Failed to get concurrency status',
+      message: error.message
+    })
+  }
+})
+
+/**
+ * GET /admin/concurrency/:apiKeyId
+ * 获取特定 API Key 的并发状态详情
+ */
+router.get('/concurrency/:apiKeyId', async (req, res) => {
+  try {
+    const { apiKeyId } = req.params
+    const status = await redis.getConcurrencyStatus(apiKeyId)
+
+    res.json({
+      success: true,
+      concurrencyStatus: status
+    })
+  } catch (error) {
+    logger.error(`❌ Failed to get concurrency status for ${req.params.apiKeyId}:`, error)
+    res.status(500).json({
+      success: false,
+      error: 'Failed to get concurrency status',
+      message: error.message
+    })
+  }
+})
+
+/**
+ * DELETE /admin/concurrency/:apiKeyId
+ * 强制清理特定 API Key 的并发计数
+ */
+router.delete('/concurrency/:apiKeyId', async (req, res) => {
+  try {
+    const { apiKeyId } = req.params
+    const result = await redis.forceClearConcurrency(apiKeyId)
+
+    logger.warn(
+      `🧹 Admin ${req.admin?.username || 'unknown'} force cleared concurrency for key ${apiKeyId}`
+    )
+
+    res.json({
+      success: true,
+      message: `Successfully cleared concurrency for API key ${apiKeyId}`,
+      result
+    })
+  } catch (error) {
+    logger.error(`❌ Failed to clear concurrency for ${req.params.apiKeyId}:`, error)
+    res.status(500).json({
+      success: false,
+      error: 'Failed to clear concurrency',
+      message: error.message
+    })
+  }
+})
+
+/**
+ * DELETE /admin/concurrency
+ * 强制清理所有并发计数
+ */
+router.delete('/concurrency', async (req, res) => {
+  try {
+    const result = await redis.forceClearAllConcurrency()
+
+    logger.warn(`🧹 Admin ${req.admin?.username || 'unknown'} force cleared ALL concurrency`)
+
+    res.json({
+      success: true,
+      message: 'Successfully cleared all concurrency',
+      result
+    })
+  } catch (error) {
+    logger.error('❌ Failed to clear all concurrency:', error)
+    res.status(500).json({
+      success: false,
+      error: 'Failed to clear all concurrency',
+      message: error.message
+    })
+  }
+})
+
+/**
+ * POST /admin/concurrency/cleanup
+ * 清理过期的并发条目（不影响活跃请求）
+ */
+router.post('/concurrency/cleanup', async (req, res) => {
+  try {
+    const { apiKeyId } = req.body
+    const result = await redis.cleanupExpiredConcurrency(apiKeyId || null)
+
+    logger.info(`🧹 Admin ${req.admin?.username || 'unknown'} cleaned up expired concurrency`)
+
+    res.json({
+      success: true,
+      message: apiKeyId
+        ? `Successfully cleaned up expired concurrency for API key ${apiKeyId}`
+        : 'Successfully cleaned up all expired concurrency',
+      result
+    })
+  } catch (error) {
+    logger.error('❌ Failed to cleanup expired concurrency:', error)
+    res.status(500).json({
+      success: false,
+      error: 'Failed to cleanup expired concurrency',
+      message: error.message
+    })
+  }
+})
+
+module.exports = router
diff --git a/src/routes/admin/index.js b/src/routes/admin/index.js
index 32b77db6..3e133c50 100644
--- a/src/routes/admin/index.js
+++ b/src/routes/admin/index.js
@@ -22,6 +22,7 @@ const droidAccountsRoutes = require('./droidAccounts')
 const dashboardRoutes = require('./dashboard')
 const usageStatsRoutes = require('./usageStats')
 const systemRoutes = require('./system')
+const concurrencyRoutes = require('./concurrency')
 
 // 挂载所有子路由
 // 使用完整路径的模块（直接挂载到根路径）
@@ -35,6 +36,7 @@ router.use('/', droidAccountsRoutes)
 router.use('/', dashboardRoutes)
 router.use('/', usageStatsRoutes)
 router.use('/', systemRoutes)
+router.use('/', concurrencyRoutes)
 
 // 使用相对路径的模块（需要指定基础路径前缀）
 router.use('/account-groups', accountGroupsRoutes)
diff --git a/src/routes/admin/usageStats.js b/src/routes/admin/usageStats.js
index f44a1b4d..bf35f8a0 100644
--- a/src/routes/admin/usageStats.js
+++ b/src/routes/admin/usageStats.js
@@ -1,8 +1,10 @@
 const express = require('express')
 const apiKeyService = require('../../services/apiKeyService')
+const ccrAccountService = require('../../services/ccrAccountService')
 const claudeAccountService = require('../../services/claudeAccountService')
 const claudeConsoleAccountService = require('../../services/claudeConsoleAccountService')
 const geminiAccountService = require('../../services/geminiAccountService')
+const geminiApiAccountService = require('../../services/geminiApiAccountService')
 const openaiAccountService = require('../../services/openaiAccountService')
 const openaiResponsesAccountService = require('../../services/openaiResponsesAccountService')
 const droidAccountService = require('../../services/droidAccountService')
@@ -14,6 +16,65 @@ const pricingService = require('../../services/pricingService')
 
 const router = express.Router()
 
+const accountTypeNames = {
+  claude: 'Claude官方',
+  'claude-console': 'Claude Console',
+  ccr: 'Claude Console Relay',
+  openai: 'OpenAI',
+  'openai-responses': 'OpenAI Responses',
+  gemini: 'Gemini',
+  'gemini-api': 'Gemini API',
+  droid: 'Droid',
+  unknown: '未知渠道'
+}
+
+const resolveAccountByPlatform = async (accountId, platform) => {
+  const serviceMap = {
+    claude: claudeAccountService,
+    'claude-console': claudeConsoleAccountService,
+    gemini: geminiAccountService,
+    'gemini-api': geminiApiAccountService,
+    openai: openaiAccountService,
+    'openai-responses': openaiResponsesAccountService,
+    droid: droidAccountService,
+    ccr: ccrAccountService
+  }
+
+  if (platform && serviceMap[platform]) {
+    try {
+      const account = await serviceMap[platform].getAccount(accountId)
+      if (account) {
+        return { ...account, platform }
+      }
+    } catch (error) {
+      logger.debug(`⚠️ Failed to get account ${accountId} from ${platform}: ${error.message}`)
+    }
+  }
+
+  for (const [platformName, service] of Object.entries(serviceMap)) {
+    try {
+      const account = await service.getAccount(accountId)
+      if (account) {
+        return { ...account, platform: platformName }
+      }
+    } catch (error) {
+      logger.debug(`⚠️ Failed to get account ${accountId} from ${platformName}: ${error.message}`)
+    }
+  }
+
+  return null
+}
+
+const getApiKeyName = async (keyId) => {
+  try {
+    const keyData = await redis.getApiKey(keyId)
+    return keyData?.name || keyData?.label || keyId
+  } catch (error) {
+    logger.debug(`⚠️ Failed to get API key name for ${keyId}: ${error.message}`)
+    return keyId
+  }
+}
+
 // 📊 账户使用统计
 
 // 获取所有账户的使用统计
@@ -148,7 +209,6 @@ router.get('/accounts/:accountId/usage-history', authenticateAdmin, async (req,
           accountData = await geminiAccountService.getAccount(accountId)
           break
         case 'gemini-api': {
-          const geminiApiAccountService = require('../../services/geminiApiAccountService')
           accountData = await geminiApiAccountService.getAccount(accountId)
           break
         }
@@ -369,7 +429,9 @@ router.get('/usage-trend', authenticateAdmin, async (req, res) => {
         logger.info(`  endDate (raw): ${endDate}`)
         logger.info(`  startTime (parsed): ${startTime.toISOString()}`)
         logger.info(`  endTime (parsed): ${endTime.toISOString()}`)
-        logger.info(`  System timezone offset: ${require('../../../config/config').system.timezoneOffset || 8}`)
+        logger.info(
+          `  System timezone offset: ${require('../../../config/config').system.timezoneOffset || 8}`
+        )
       } else {
         // 默认最近24小时
         endTime = new Date()
@@ -890,7 +952,6 @@ router.get('/account-usage-trend', authenticateAdmin, async (req, res) => {
         })
       ]
     } else if (group === 'gemini') {
-      const geminiApiAccountService = require('../../services/geminiApiAccountService')
       const [geminiAccounts, geminiApiAccounts] = await Promise.all([
         geminiAccountService.getAllAccounts(),
         geminiApiAccountService.getAllAccounts(true)
@@ -1818,4 +1879,628 @@ router.get('/usage-costs', authenticateAdmin, async (req, res) => {
   }
 })
 
+// 获取 API Key 的请求记录时间线
+router.get('/api-keys/:keyId/usage-records', authenticateAdmin, async (req, res) => {
+  try {
+    const { keyId } = req.params
+    const {
+      page = 1,
+      pageSize = 50,
+      startDate,
+      endDate,
+      model,
+      accountId,
+      sortOrder = 'desc'
+    } = req.query
+
+    const pageNumber = Math.max(parseInt(page, 10) || 1, 1)
+    const pageSizeNumber = Math.min(Math.max(parseInt(pageSize, 10) || 50, 1), 200)
+    const normalizedSortOrder = sortOrder === 'asc' ? 'asc' : 'desc'
+
+    const startTime = startDate ? new Date(startDate) : null
+    const endTime = endDate ? new Date(endDate) : null
+
+    if (
+      (startDate && Number.isNaN(startTime?.getTime())) ||
+      (endDate && Number.isNaN(endTime?.getTime()))
+    ) {
+      return res.status(400).json({ success: false, error: 'Invalid date range' })
+    }
+
+    if (startTime && endTime && startTime > endTime) {
+      return res
+        .status(400)
+        .json({ success: false, error: 'Start date must be before or equal to end date' })
+    }
+
+    const apiKeyInfo = await redis.getApiKey(keyId)
+    if (!apiKeyInfo || Object.keys(apiKeyInfo).length === 0) {
+      return res.status(404).json({ success: false, error: 'API key not found' })
+    }
+
+    const rawRecords = await redis.getUsageRecords(keyId, 5000)
+
+    const accountServices = [
+      { type: 'claude', getter: (id) => claudeAccountService.getAccount(id) },
+      { type: 'claude-console', getter: (id) => claudeConsoleAccountService.getAccount(id) },
+      { type: 'ccr', getter: (id) => ccrAccountService.getAccount(id) },
+      { type: 'openai', getter: (id) => openaiAccountService.getAccount(id) },
+      { type: 'openai-responses', getter: (id) => openaiResponsesAccountService.getAccount(id) },
+      { type: 'gemini', getter: (id) => geminiAccountService.getAccount(id) },
+      { type: 'gemini-api', getter: (id) => geminiApiAccountService.getAccount(id) },
+      { type: 'droid', getter: (id) => droidAccountService.getAccount(id) }
+    ]
+
+    const accountCache = new Map()
+    const resolveAccountInfo = async (id, type) => {
+      if (!id) {
+        return null
+      }
+
+      const cacheKey = `${type || 'any'}:${id}`
+      if (accountCache.has(cacheKey)) {
+        return accountCache.get(cacheKey)
+      }
+
+      let servicesToTry = type
+        ? accountServices.filter((svc) => svc.type === type)
+        : accountServices
+
+      // 若渠道改名或传入未知类型，回退尝试全量服务，避免漏解析历史账号
+      if (!servicesToTry.length) {
+        servicesToTry = accountServices
+      }
+
+      for (const service of servicesToTry) {
+        try {
+          const account = await service.getter(id)
+          if (account) {
+            const info = {
+              id,
+              name: account.name || account.email || id,
+              type: service.type,
+              status: account.status || account.isActive
+            }
+            accountCache.set(cacheKey, info)
+            return info
+          }
+        } catch (error) {
+          logger.debug(`⚠️ Failed to resolve account ${id} via ${service.type}: ${error.message}`)
+        }
+      }
+
+      accountCache.set(cacheKey, null)
+      return null
+    }
+
+    const toUsageObject = (record) => ({
+      input_tokens: record.inputTokens || 0,
+      output_tokens: record.outputTokens || 0,
+      cache_creation_input_tokens: record.cacheCreateTokens || 0,
+      cache_read_input_tokens: record.cacheReadTokens || 0,
+      cache_creation: record.cacheCreation || record.cache_creation || null
+    })
+
+    const withinRange = (record) => {
+      if (!record.timestamp) {
+        return false
+      }
+      const ts = new Date(record.timestamp)
+      if (Number.isNaN(ts.getTime())) {
+        return false
+      }
+      if (startTime && ts < startTime) {
+        return false
+      }
+      if (endTime && ts > endTime) {
+        return false
+      }
+      return true
+    }
+
+    const filteredRecords = rawRecords.filter((record) => {
+      if (!withinRange(record)) {
+        return false
+      }
+      if (model && record.model !== model) {
+        return false
+      }
+      if (accountId && record.accountId !== accountId) {
+        return false
+      }
+      return true
+    })
+
+    filteredRecords.sort((a, b) => {
+      const aTime = new Date(a.timestamp).getTime()
+      const bTime = new Date(b.timestamp).getTime()
+      if (Number.isNaN(aTime) || Number.isNaN(bTime)) {
+        return 0
+      }
+      return normalizedSortOrder === 'asc' ? aTime - bTime : bTime - aTime
+    })
+
+    const summary = {
+      totalRequests: 0,
+      inputTokens: 0,
+      outputTokens: 0,
+      cacheCreateTokens: 0,
+      cacheReadTokens: 0,
+      totalTokens: 0,
+      totalCost: 0
+    }
+
+    const modelSet = new Set()
+    const accountOptionMap = new Map()
+    let earliestTimestamp = null
+    let latestTimestamp = null
+
+    for (const record of filteredRecords) {
+      const usage = toUsageObject(record)
+      const costData = CostCalculator.calculateCost(usage, record.model || 'unknown')
+      const computedCost =
+        typeof record.cost === 'number' ? record.cost : costData?.costs?.total || 0
+      const totalTokens =
+        record.totalTokens ||
+        usage.input_tokens +
+          usage.output_tokens +
+          usage.cache_creation_input_tokens +
+          usage.cache_read_input_tokens
+
+      summary.totalRequests += 1
+      summary.inputTokens += usage.input_tokens
+      summary.outputTokens += usage.output_tokens
+      summary.cacheCreateTokens += usage.cache_creation_input_tokens
+      summary.cacheReadTokens += usage.cache_read_input_tokens
+      summary.totalTokens += totalTokens
+      summary.totalCost += computedCost
+
+      if (record.model) {
+        modelSet.add(record.model)
+      }
+
+      if (record.accountId) {
+        const normalizedType = record.accountType || 'unknown'
+        if (!accountOptionMap.has(record.accountId)) {
+          accountOptionMap.set(record.accountId, {
+            id: record.accountId,
+            accountTypes: new Set([normalizedType])
+          })
+        } else {
+          accountOptionMap.get(record.accountId).accountTypes.add(normalizedType)
+        }
+      }
+
+      if (record.timestamp) {
+        const ts = new Date(record.timestamp)
+        if (!Number.isNaN(ts.getTime())) {
+          if (!earliestTimestamp || ts < earliestTimestamp) {
+            earliestTimestamp = ts
+          }
+          if (!latestTimestamp || ts > latestTimestamp) {
+            latestTimestamp = ts
+          }
+        }
+      }
+    }
+
+    const totalRecords = filteredRecords.length
+    const totalPages = totalRecords > 0 ? Math.ceil(totalRecords / pageSizeNumber) : 0
+    const safePage = totalPages > 0 ? Math.min(pageNumber, totalPages) : 1
+    const startIndex = (safePage - 1) * pageSizeNumber
+    const pageRecords =
+      totalRecords === 0 ? [] : filteredRecords.slice(startIndex, startIndex + pageSizeNumber)
+
+    const enrichedRecords = []
+    for (const record of pageRecords) {
+      const usage = toUsageObject(record)
+      const costData = CostCalculator.calculateCost(usage, record.model || 'unknown')
+      const computedCost =
+        typeof record.cost === 'number' ? record.cost : costData?.costs?.total || 0
+      const totalTokens =
+        record.totalTokens ||
+        usage.input_tokens +
+          usage.output_tokens +
+          usage.cache_creation_input_tokens +
+          usage.cache_read_input_tokens
+
+      const accountInfo = await resolveAccountInfo(record.accountId, record.accountType)
+      const resolvedAccountType = accountInfo?.type || record.accountType || 'unknown'
+
+      enrichedRecords.push({
+        timestamp: record.timestamp,
+        model: record.model || 'unknown',
+        accountId: record.accountId || null,
+        accountName: accountInfo?.name || null,
+        accountStatus: accountInfo?.status ?? null,
+        accountType: resolvedAccountType,
+        accountTypeName: accountTypeNames[resolvedAccountType] || '未知渠道',
+        inputTokens: usage.input_tokens,
+        outputTokens: usage.output_tokens,
+        cacheCreateTokens: usage.cache_creation_input_tokens,
+        cacheReadTokens: usage.cache_read_input_tokens,
+        ephemeral5mTokens: record.ephemeral5mTokens || 0,
+        ephemeral1hTokens: record.ephemeral1hTokens || 0,
+        totalTokens,
+        isLongContextRequest: record.isLongContext || record.isLongContextRequest || false,
+        cost: Number(computedCost.toFixed(6)),
+        costFormatted:
+          record.costFormatted ||
+          costData?.formatted?.total ||
+          CostCalculator.formatCost(computedCost),
+        costBreakdown: record.costBreakdown || {
+          input: costData?.costs?.input || 0,
+          output: costData?.costs?.output || 0,
+          cacheCreate: costData?.costs?.cacheWrite || 0,
+          cacheRead: costData?.costs?.cacheRead || 0,
+          total: costData?.costs?.total || computedCost
+        },
+        responseTime: record.responseTime || null
+      })
+    }
+
+    const accountOptions = []
+    for (const option of accountOptionMap.values()) {
+      const types = Array.from(option.accountTypes || [])
+
+      // 优先按历史出现的 accountType 解析，若失败则回退全量解析
+      let resolvedInfo = null
+      for (const type of types) {
+        resolvedInfo = await resolveAccountInfo(option.id, type)
+        if (resolvedInfo && resolvedInfo.name) {
+          break
+        }
+      }
+      if (!resolvedInfo) {
+        resolvedInfo = await resolveAccountInfo(option.id)
+      }
+
+      const chosenType = resolvedInfo?.type || types[0] || 'unknown'
+      const chosenTypeName = accountTypeNames[chosenType] || '未知渠道'
+
+      if (!resolvedInfo) {
+        logger.warn(`⚠️ 保留无法解析的账户筛选项: ${option.id}, types=${types.join(',') || 'none'}`)
+      }
+
+      accountOptions.push({
+        id: option.id,
+        name: resolvedInfo?.name || option.id,
+        accountType: chosenType,
+        accountTypeName: chosenTypeName,
+        rawTypes: types
+      })
+    }
+
+    return res.json({
+      success: true,
+      data: {
+        records: enrichedRecords,
+        pagination: {
+          currentPage: safePage,
+          pageSize: pageSizeNumber,
+          totalRecords,
+          totalPages,
+          hasNextPage: totalPages > 0 && safePage < totalPages,
+          hasPreviousPage: totalPages > 0 && safePage > 1
+        },
+        filters: {
+          startDate: startTime ? startTime.toISOString() : null,
+          endDate: endTime ? endTime.toISOString() : null,
+          model: model || null,
+          accountId: accountId || null,
+          sortOrder: normalizedSortOrder
+        },
+        apiKeyInfo: {
+          id: keyId,
+          name: apiKeyInfo.name || apiKeyInfo.label || keyId
+        },
+        summary: {
+          ...summary,
+          totalCost: Number(summary.totalCost.toFixed(6)),
+          avgCost:
+            summary.totalRequests > 0
+              ? Number((summary.totalCost / summary.totalRequests).toFixed(6))
+              : 0
+        },
+        availableFilters: {
+          models: Array.from(modelSet),
+          accounts: accountOptions,
+          dateRange: {
+            earliest: earliestTimestamp ? earliestTimestamp.toISOString() : null,
+            latest: latestTimestamp ? latestTimestamp.toISOString() : null
+          }
+        }
+      }
+    })
+  } catch (error) {
+    logger.error('❌ Failed to get API key usage records:', error)
+    return res
+      .status(500)
+      .json({ error: 'Failed to get API key usage records', message: error.message })
+  }
+})
+
+// 获取账户的请求记录时间线
+router.get('/accounts/:accountId/usage-records', authenticateAdmin, async (req, res) => {
+  try {
+    const { accountId } = req.params
+    const {
+      platform,
+      page = 1,
+      pageSize = 50,
+      startDate,
+      endDate,
+      model,
+      apiKeyId,
+      sortOrder = 'desc'
+    } = req.query
+
+    const pageNumber = Math.max(parseInt(page, 10) || 1, 1)
+    const pageSizeNumber = Math.min(Math.max(parseInt(pageSize, 10) || 50, 1), 200)
+    const normalizedSortOrder = sortOrder === 'asc' ? 'asc' : 'desc'
+
+    const startTime = startDate ? new Date(startDate) : null
+    const endTime = endDate ? new Date(endDate) : null
+
+    if (
+      (startDate && Number.isNaN(startTime?.getTime())) ||
+      (endDate && Number.isNaN(endTime?.getTime()))
+    ) {
+      return res.status(400).json({ success: false, error: 'Invalid date range' })
+    }
+
+    if (startTime && endTime && startTime > endTime) {
+      return res
+        .status(400)
+        .json({ success: false, error: 'Start date must be before or equal to end date' })
+    }
+
+    const accountInfo = await resolveAccountByPlatform(accountId, platform)
+    if (!accountInfo) {
+      return res.status(404).json({ success: false, error: 'Account not found' })
+    }
+
+    const allApiKeys = await apiKeyService.getAllApiKeys(true)
+    const apiKeyNameCache = new Map(
+      allApiKeys.map((key) => [key.id, key.name || key.label || key.id])
+    )
+
+    let keysToUse = apiKeyId ? allApiKeys.filter((key) => key.id === apiKeyId) : allApiKeys
+    if (apiKeyId && keysToUse.length === 0) {
+      keysToUse = [{ id: apiKeyId }]
+    }
+
+    const toUsageObject = (record) => ({
+      input_tokens: record.inputTokens || 0,
+      output_tokens: record.outputTokens || 0,
+      cache_creation_input_tokens: record.cacheCreateTokens || 0,
+      cache_read_input_tokens: record.cacheReadTokens || 0,
+      cache_creation: record.cacheCreation || record.cache_creation || null
+    })
+
+    const withinRange = (record) => {
+      if (!record.timestamp) {
+        return false
+      }
+      const ts = new Date(record.timestamp)
+      if (Number.isNaN(ts.getTime())) {
+        return false
+      }
+      if (startTime && ts < startTime) {
+        return false
+      }
+      if (endTime && ts > endTime) {
+        return false
+      }
+      return true
+    }
+
+    const filteredRecords = []
+    const modelSet = new Set()
+    const apiKeyOptionMap = new Map()
+    let earliestTimestamp = null
+    let latestTimestamp = null
+
+    const batchSize = 10
+    for (let i = 0; i < keysToUse.length; i += batchSize) {
+      const batch = keysToUse.slice(i, i + batchSize)
+      const batchResults = await Promise.all(
+        batch.map(async (key) => {
+          try {
+            const records = await redis.getUsageRecords(key.id, 5000)
+            return { keyId: key.id, records: records || [] }
+          } catch (error) {
+            logger.debug(`⚠️ Failed to get usage records for key ${key.id}: ${error.message}`)
+            return { keyId: key.id, records: [] }
+          }
+        })
+      )
+
+      for (const { keyId, records } of batchResults) {
+        const apiKeyName = apiKeyNameCache.get(keyId) || (await getApiKeyName(keyId))
+        for (const record of records) {
+          if (record.accountId !== accountId) {
+            continue
+          }
+          if (!withinRange(record)) {
+            continue
+          }
+          if (model && record.model !== model) {
+            continue
+          }
+
+          const accountType = record.accountType || accountInfo.platform || 'unknown'
+          const normalizedModel = record.model || 'unknown'
+
+          modelSet.add(normalizedModel)
+          apiKeyOptionMap.set(keyId, { id: keyId, name: apiKeyName })
+
+          if (record.timestamp) {
+            const ts = new Date(record.timestamp)
+            if (!Number.isNaN(ts.getTime())) {
+              if (!earliestTimestamp || ts < earliestTimestamp) {
+                earliestTimestamp = ts
+              }
+              if (!latestTimestamp || ts > latestTimestamp) {
+                latestTimestamp = ts
+              }
+            }
+          }
+
+          filteredRecords.push({
+            ...record,
+            model: normalizedModel,
+            accountType,
+            apiKeyId: keyId,
+            apiKeyName
+          })
+        }
+      }
+    }
+
+    filteredRecords.sort((a, b) => {
+      const aTime = new Date(a.timestamp).getTime()
+      const bTime = new Date(b.timestamp).getTime()
+      if (Number.isNaN(aTime) || Number.isNaN(bTime)) {
+        return 0
+      }
+      return normalizedSortOrder === 'asc' ? aTime - bTime : bTime - aTime
+    })
+
+    const summary = {
+      totalRequests: 0,
+      inputTokens: 0,
+      outputTokens: 0,
+      cacheCreateTokens: 0,
+      cacheReadTokens: 0,
+      totalTokens: 0,
+      totalCost: 0
+    }
+
+    for (const record of filteredRecords) {
+      const usage = toUsageObject(record)
+      const costData = CostCalculator.calculateCost(usage, record.model || 'unknown')
+      const computedCost =
+        typeof record.cost === 'number' ? record.cost : costData?.costs?.total || 0
+      const totalTokens =
+        record.totalTokens ||
+        usage.input_tokens +
+          usage.output_tokens +
+          usage.cache_creation_input_tokens +
+          usage.cache_read_input_tokens
+
+      summary.totalRequests += 1
+      summary.inputTokens += usage.input_tokens
+      summary.outputTokens += usage.output_tokens
+      summary.cacheCreateTokens += usage.cache_creation_input_tokens
+      summary.cacheReadTokens += usage.cache_read_input_tokens
+      summary.totalTokens += totalTokens
+      summary.totalCost += computedCost
+    }
+
+    const totalRecords = filteredRecords.length
+    const totalPages = totalRecords > 0 ? Math.ceil(totalRecords / pageSizeNumber) : 0
+    const safePage = totalPages > 0 ? Math.min(pageNumber, totalPages) : 1
+    const startIndex = (safePage - 1) * pageSizeNumber
+    const pageRecords =
+      totalRecords === 0 ? [] : filteredRecords.slice(startIndex, startIndex + pageSizeNumber)
+
+    const enrichedRecords = []
+    for (const record of pageRecords) {
+      const usage = toUsageObject(record)
+      const costData = CostCalculator.calculateCost(usage, record.model || 'unknown')
+      const computedCost =
+        typeof record.cost === 'number' ? record.cost : costData?.costs?.total || 0
+      const totalTokens =
+        record.totalTokens ||
+        usage.input_tokens +
+          usage.output_tokens +
+          usage.cache_creation_input_tokens +
+          usage.cache_read_input_tokens
+
+      enrichedRecords.push({
+        timestamp: record.timestamp,
+        model: record.model || 'unknown',
+        apiKeyId: record.apiKeyId,
+        apiKeyName: record.apiKeyName,
+        accountId,
+        accountName: accountInfo.name || accountInfo.email || accountId,
+        accountType: record.accountType,
+        accountTypeName: accountTypeNames[record.accountType] || '未知渠道',
+        inputTokens: usage.input_tokens,
+        outputTokens: usage.output_tokens,
+        cacheCreateTokens: usage.cache_creation_input_tokens,
+        cacheReadTokens: usage.cache_read_input_tokens,
+        ephemeral5mTokens: record.ephemeral5mTokens || 0,
+        ephemeral1hTokens: record.ephemeral1hTokens || 0,
+        totalTokens,
+        isLongContextRequest: record.isLongContext || record.isLongContextRequest || false,
+        cost: Number(computedCost.toFixed(6)),
+        costFormatted:
+          record.costFormatted ||
+          costData?.formatted?.total ||
+          CostCalculator.formatCost(computedCost),
+        costBreakdown: record.costBreakdown || {
+          input: costData?.costs?.input || 0,
+          output: costData?.costs?.output || 0,
+          cacheCreate: costData?.costs?.cacheWrite || 0,
+          cacheRead: costData?.costs?.cacheRead || 0,
+          total: costData?.costs?.total || computedCost
+        },
+        responseTime: record.responseTime || null
+      })
+    }
+
+    return res.json({
+      success: true,
+      data: {
+        records: enrichedRecords,
+        pagination: {
+          currentPage: safePage,
+          pageSize: pageSizeNumber,
+          totalRecords,
+          totalPages,
+          hasNextPage: totalPages > 0 && safePage < totalPages,
+          hasPreviousPage: totalPages > 0 && safePage > 1
+        },
+        filters: {
+          startDate: startTime ? startTime.toISOString() : null,
+          endDate: endTime ? endTime.toISOString() : null,
+          model: model || null,
+          apiKeyId: apiKeyId || null,
+          platform: accountInfo.platform,
+          sortOrder: normalizedSortOrder
+        },
+        accountInfo: {
+          id: accountId,
+          name: accountInfo.name || accountInfo.email || accountId,
+          platform: accountInfo.platform || platform || 'unknown',
+          status: accountInfo.status ?? accountInfo.isActive ?? null
+        },
+        summary: {
+          ...summary,
+          totalCost: Number(summary.totalCost.toFixed(6)),
+          avgCost:
+            summary.totalRequests > 0
+              ? Number((summary.totalCost / summary.totalRequests).toFixed(6))
+              : 0
+        },
+        availableFilters: {
+          models: Array.from(modelSet),
+          apiKeys: Array.from(apiKeyOptionMap.values()),
+          dateRange: {
+            earliest: earliestTimestamp ? earliestTimestamp.toISOString() : null,
+            latest: latestTimestamp ? latestTimestamp.toISOString() : null
+          }
+        }
+      }
+    })
+  } catch (error) {
+    logger.error('❌ Failed to get account usage records:', error)
+    return res
+      .status(500)
+      .json({ error: 'Failed to get account usage records', message: error.message })
+  }
+})
+
 module.exports = router
diff --git a/src/routes/admin/utils.js b/src/routes/admin/utils.js
index 47b68123..49c02015 100644
--- a/src/routes/admin/utils.js
+++ b/src/routes/admin/utils.js
@@ -33,7 +33,9 @@ function mapExpiryField(updates, accountType, accountId) {
   if ('expiresAt' in mappedUpdates) {
     mappedUpdates.subscriptionExpiresAt = mappedUpdates.expiresAt
     delete mappedUpdates.expiresAt
-    logger.info(`Mapping expiresAt to subscriptionExpiresAt for ${accountType} account ${accountId}`)
+    logger.info(
+      `Mapping expiresAt to subscriptionExpiresAt for ${accountType} account ${accountId}`
+    )
   }
   return mappedUpdates
 }
diff --git a/src/routes/api.js b/src/routes/api.js
index ce31440d..b99cf6cc 100644
--- a/src/routes/api.js
+++ b/src/routes/api.js
@@ -824,7 +824,8 @@ router.get('/v1/models', authenticateApiKey, async (req, res) => {
     // 可选：根据 API Key 的模型限制过滤
     let filteredModels = models
     if (req.apiKey.enableModelRestriction && req.apiKey.restrictedModels?.length > 0) {
-      filteredModels = models.filter((model) => req.apiKey.restrictedModels.includes(model.id))
+      // 将 restrictedModels 视为黑名单：过滤掉受限模型
+      filteredModels = models.filter((model) => !req.apiKey.restrictedModels.includes(model.id))
     }
 
     res.json({
diff --git a/src/routes/openaiClaudeRoutes.js b/src/routes/openaiClaudeRoutes.js
index 032c242f..2bb7cc09 100644
--- a/src/routes/openaiClaudeRoutes.js
+++ b/src/routes/openaiClaudeRoutes.js
@@ -15,6 +15,7 @@ const claudeCodeHeadersService = require('../services/claudeCodeHeadersService')
 const sessionHelper = require('../utils/sessionHelper')
 const { updateRateLimitCounters } = require('../utils/rateLimitHelper')
 const pricingService = require('../services/pricingService')
+const { getEffectiveModel } = require('../utils/modelHelper')
 
 // 🔧 辅助函数：检查 API Key 权限
 function checkPermissions(apiKeyData, requiredPermission = 'claude') {
@@ -75,9 +76,9 @@ router.get('/v1/models', authenticateApiKey, async (req, res) => {
       }
     ]
 
-    // 如果启用了模型限制，过滤模型列表
+    // 如果启用了模型限制，视为黑名单：过滤掉受限模型
     if (apiKeyData.enableModelRestriction && apiKeyData.restrictedModels?.length > 0) {
-      models = models.filter((model) => apiKeyData.restrictedModels.includes(model.id))
+      models = models.filter((model) => !apiKeyData.restrictedModels.includes(model.id))
     }
 
     res.json({
@@ -114,9 +115,9 @@ router.get('/v1/models/:model', authenticateApiKey, async (req, res) => {
       })
     }
 
-    // 检查模型限制
+    // 模型限制（黑名单）：命中则直接拒绝
     if (apiKeyData.enableModelRestriction && apiKeyData.restrictedModels?.length > 0) {
-      if (!apiKeyData.restrictedModels.includes(modelId)) {
+      if (apiKeyData.restrictedModels.includes(modelId)) {
         return res.status(404).json({
           error: {
             message: `Model '${modelId}' not found`,
@@ -199,9 +200,10 @@ async function handleChatCompletion(req, res, apiKeyData) {
     // 转换 OpenAI 请求为 Claude 格式
     const claudeRequest = openaiToClaude.convertRequest(req.body)
 
-    // 检查模型限制
+    // 模型限制（黑名单）：命中受限模型则拒绝
     if (apiKeyData.enableModelRestriction && apiKeyData.restrictedModels?.length > 0) {
-      if (!apiKeyData.restrictedModels.includes(claudeRequest.model)) {
+      const effectiveModel = getEffectiveModel(claudeRequest.model || '')
+      if (apiKeyData.restrictedModels.includes(effectiveModel)) {
         return res.status(403).json({
           error: {
             message: `Model ${req.body.model} is not allowed for this API key`,
diff --git a/src/routes/openaiRoutes.js b/src/routes/openaiRoutes.js
index 41fa1977..7faf9e87 100644
--- a/src/routes/openaiRoutes.js
+++ b/src/routes/openaiRoutes.js
@@ -247,9 +247,11 @@ const handleResponses = async (req, res) => {
 
     // 从请求体中提取模型和流式标志
     let requestedModel = req.body?.model || null
+    const isCodexModel =
+      typeof requestedModel === 'string' && requestedModel.toLowerCase().includes('codex')
 
-    // 如果模型是 gpt-5 开头且后面还有内容（如 gpt-5-2025-08-07），则覆盖为 gpt-5
-    if (requestedModel && requestedModel.startsWith('gpt-5-') && requestedModel !== 'gpt-5-codex') {
+    // 如果模型是 gpt-5 开头且后面还有内容（如 gpt-5-2025-08-07），并且不是 Codex 系列，则覆盖为 gpt-5
+    if (requestedModel && requestedModel.startsWith('gpt-5-') && !isCodexModel) {
       logger.info(`📝 Model ${requestedModel} detected, normalizing to gpt-5 for Codex API`)
       requestedModel = 'gpt-5'
       req.body.model = 'gpt-5' // 同时更新请求体中的模型
diff --git a/src/services/claudeAccountService.js b/src/services/claudeAccountService.js
index 29a7821e..77630364 100644
--- a/src/services/claudeAccountService.js
+++ b/src/services/claudeAccountService.js
@@ -16,6 +16,22 @@ const {
 const tokenRefreshService = require('./tokenRefreshService')
 const LRUCache = require('../utils/lruCache')
 const { formatDateWithTimezone, getISOStringWithTimezone } = require('../utils/dateHelper')
+const { isOpus45OrNewer } = require('../utils/modelHelper')
+
+/**
+ * Check if account is Pro (not Max)
+ * Compatible with both API real-time data (hasClaudePro) and local config (accountType)
+ * @param {Object} info - Subscription info object
+ * @returns {boolean}
+ */
+function isProAccount(info) {
+  // API real-time status takes priority
+  if (info.hasClaudePro === true && info.hasClaudeMax !== true) {
+    return true
+  }
+  // Local configured account type
+  return info.accountType === 'claude_pro'
+}
 
 class ClaudeAccountService {
   constructor() {
@@ -852,31 +868,39 @@ class ClaudeAccountService {
           !this.isSubscriptionExpired(account)
       )
 
-      // 如果请求的是 Opus 模型，过滤掉 Pro 和 Free 账号
+      // Filter Opus models based on account type and model version
       if (modelName && modelName.toLowerCase().includes('opus')) {
+        const isNewOpus = isOpus45OrNewer(modelName)
+
         activeAccounts = activeAccounts.filter((account) => {
-          // 检查账号的订阅信息
           if (account.subscriptionInfo) {
             try {
               const info = JSON.parse(account.subscriptionInfo)
-              // Pro 和 Free 账号不支持 Opus
-              if (info.hasClaudePro === true && info.hasClaudeMax !== true) {
-                return false // Claude Pro 不支持 Opus
+
+              // Free account: does not support any Opus model
+              if (info.accountType === 'free') {
+                return false
               }
-              if (info.accountType === 'claude_pro' || info.accountType === 'claude_free') {
-                return false // 明确标记为 Pro 或 Free 的账号不支持
+
+              // Pro account: only supports Opus 4.5+
+              if (isProAccount(info)) {
+                return isNewOpus
               }
+
+              // Max account: supports all Opus versions
+              return true
             } catch (e) {
-              // 解析失败，假设为旧数据，默认支持（兼容旧数据为 Max）
+              // Parse failed, assume legacy data (Max), default support
               return true
             }
           }
-          // 没有订阅信息的账号，默认当作支持（兼容旧数据）
+          // Account without subscription info, default to supported (legacy data compatibility)
           return true
         })
 
         if (activeAccounts.length === 0) {
-          throw new Error('No Claude accounts available that support Opus model')
+          const modelDesc = isNewOpus ? 'Opus 4.5+' : 'legacy Opus (requires Max subscription)'
+          throw new Error(`No Claude accounts available that support ${modelDesc} model`)
         }
       }
 
@@ -970,31 +994,39 @@ class ClaudeAccountService {
           !this.isSubscriptionExpired(account)
       )
 
-      // 如果请求的是 Opus 模型，过滤掉 Pro 和 Free 账号
+      // Filter Opus models based on account type and model version
       if (modelName && modelName.toLowerCase().includes('opus')) {
+        const isNewOpus = isOpus45OrNewer(modelName)
+
         sharedAccounts = sharedAccounts.filter((account) => {
-          // 检查账号的订阅信息
           if (account.subscriptionInfo) {
             try {
               const info = JSON.parse(account.subscriptionInfo)
-              // Pro 和 Free 账号不支持 Opus
-              if (info.hasClaudePro === true && info.hasClaudeMax !== true) {
-                return false // Claude Pro 不支持 Opus
+
+              // Free account: does not support any Opus model
+              if (info.accountType === 'free') {
+                return false
               }
-              if (info.accountType === 'claude_pro' || info.accountType === 'claude_free') {
-                return false // 明确标记为 Pro 或 Free 的账号不支持
+
+              // Pro account: only supports Opus 4.5+
+              if (isProAccount(info)) {
+                return isNewOpus
               }
+
+              // Max account: supports all Opus versions
+              return true
             } catch (e) {
-              // 解析失败，假设为旧数据，默认支持（兼容旧数据为 Max）
+              // Parse failed, assume legacy data (Max), default support
               return true
             }
           }
-          // 没有订阅信息的账号，默认当作支持（兼容旧数据）
+          // Account without subscription info, default to supported (legacy data compatibility)
           return true
         })
 
         if (sharedAccounts.length === 0) {
-          throw new Error('No shared Claude accounts available that support Opus model')
+          const modelDesc = isNewOpus ? 'Opus 4.5+' : 'legacy Opus (requires Max subscription)'
+          throw new Error(`No shared Claude accounts available that support ${modelDesc} model`)
         }
       }
 
diff --git a/src/services/claudeRelayService.js b/src/services/claudeRelayService.js
index 9feeae0d..166d575b 100644
--- a/src/services/claudeRelayService.js
+++ b/src/services/claudeRelayService.js
@@ -1948,7 +1948,13 @@ class ClaudeRelayService {
   }
 
   // 🛠️ 统一的错误处理方法
-  async _handleServerError(accountId, statusCode, _sessionHash = null, context = '') {
+  async _handleServerError(
+    accountId,
+    statusCode,
+    sessionHash = null,
+    context = '',
+    accountType = 'claude-official'
+  ) {
     try {
       await claudeAccountService.recordServerError(accountId, statusCode)
       const errorCount = await claudeAccountService.getServerErrorCount(accountId)
@@ -1962,6 +1968,18 @@ class ClaudeRelayService {
         `⏱️ ${prefix}${isTimeout ? 'Timeout' : 'Server'} error for account ${accountId}, error count: ${errorCount}/${threshold}`
       )
 
+      // 标记账户为临时不可用（5分钟）
+      try {
+        await unifiedClaudeScheduler.markAccountTemporarilyUnavailable(
+          accountId,
+          accountType,
+          sessionHash,
+          300
+        )
+      } catch (markError) {
+        logger.error(`❌ Failed to mark account temporarily unavailable: ${accountId}`, markError)
+      }
+
       if (errorCount > threshold) {
         const errorTypeLabel = isTimeout ? 'timeout' : '5xx'
         // ⚠️ 只记录5xx/504告警，不再自动停止调度，避免上游抖动导致误停
diff --git a/src/services/unifiedClaudeScheduler.js b/src/services/unifiedClaudeScheduler.js
index e68d607e..aac79971 100644
--- a/src/services/unifiedClaudeScheduler.js
+++ b/src/services/unifiedClaudeScheduler.js
@@ -5,7 +5,33 @@ const ccrAccountService = require('./ccrAccountService')
 const accountGroupService = require('./accountGroupService')
 const redis = require('../models/redis')
 const logger = require('../utils/logger')
-const { parseVendorPrefixedModel } = require('../utils/modelHelper')
+const { parseVendorPrefixedModel, isOpus45OrNewer } = require('../utils/modelHelper')
+
+/**
+ * Check if account is Pro (not Max)
+ *
+ * ACCOUNT TYPE LOGIC (as of 2025-12-05):
+ * Pro accounts can be identified by either:
+ *   1. API real-time data: hasClaudePro=true && hasClaudeMax=false
+ *   2. Local config data: accountType='claude_pro'
+ *
+ * Account type restrictions for Opus models:
+ *   - Free account: No Opus access at all
+ *   - Pro account: Only Opus 4.5+ (new versions)
+ *   - Max account: All Opus versions (legacy 3.x, 4.0, 4.1 and new 4.5+)
+ *
+ * Compatible with both API real-time data (hasClaudePro) and local config (accountType)
+ * @param {Object} info - Subscription info object
+ * @returns {boolean} - true if Pro account (not Free, not Max)
+ */
+function isProAccount(info) {
+  // API real-time status takes priority
+  if (info.hasClaudePro === true && info.hasClaudeMax !== true) {
+    return true
+  }
+  // Local configured account type
+  return info.accountType === 'claude_pro'
+}
 
 class UnifiedClaudeScheduler {
   constructor() {
@@ -46,8 +72,14 @@ class UnifiedClaudeScheduler {
         return false
       }
 
-      // 2. Opus 模型的订阅级别检查
+      // 2. Opus model subscription level check
+      // VERSION RESTRICTION LOGIC:
+      // - Free: No Opus models
+      // - Pro: Only Opus 4.5+ (isOpus45OrNewer = true)
+      // - Max: All Opus versions
       if (requestedModel.toLowerCase().includes('opus')) {
+        const isNewOpus = isOpus45OrNewer(requestedModel)
+
         if (account.subscriptionInfo) {
           try {
             const info =
@@ -55,27 +87,36 @@ class UnifiedClaudeScheduler {
                 ? JSON.parse(account.subscriptionInfo)
                 : account.subscriptionInfo
 
-            // Pro 和 Free 账号不支持 Opus
-            if (info.hasClaudePro === true && info.hasClaudeMax !== true) {
+            // Free account: does not support any Opus model
+            if (info.accountType === 'free') {
               logger.info(
-                `🚫 Claude account ${account.name} (Pro) does not support Opus model${context ? ` ${context}` : ''}`
+                `🚫 Claude account ${account.name} (Free) does not support Opus model${context ? ` ${context}` : ''}`
               )
               return false
             }
-            if (info.accountType === 'claude_pro' || info.accountType === 'claude_free') {
-              logger.info(
-                `🚫 Claude account ${account.name} (${info.accountType}) does not support Opus model${context ? ` ${context}` : ''}`
-              )
-              return false
+
+            // Pro account: only supports Opus 4.5+
+            // Reject legacy Opus (3.x, 4.0-4.4) but allow new Opus (4.5+)
+            if (isProAccount(info)) {
+              if (!isNewOpus) {
+                logger.info(
+                  `🚫 Claude account ${account.name} (Pro) does not support legacy Opus model${context ? ` ${context}` : ''}`
+                )
+                return false
+              }
+              // Opus 4.5+ supported
+              return true
             }
+
+            // Max account: supports all Opus versions (no restriction)
           } catch (e) {
-            // 解析失败，假设为旧数据，默认支持（兼容旧数据为 Max）
+            // Parse failed, assume legacy data (Max), default support
             logger.debug(
               `Account ${account.name} has invalid subscriptionInfo${context ? ` ${context}` : ''}, assuming Max`
             )
           }
         }
-        // 没有订阅信息的账号，默认当作支持（兼容旧数据）
+        // Account without subscription info, default to supported (legacy data compatibility)
       }
     }
 
@@ -177,30 +218,41 @@ class UnifiedClaudeScheduler {
         // 普通专属账户
         const boundAccount = await redis.getClaudeAccount(apiKeyData.claudeAccountId)
         if (boundAccount && boundAccount.isActive === 'true' && boundAccount.status !== 'error') {
-          const isRateLimited = await claudeAccountService.isAccountRateLimited(boundAccount.id)
-          if (isRateLimited) {
-            const rateInfo = await claudeAccountService.getAccountRateLimitInfo(boundAccount.id)
-            const error = new Error('Dedicated Claude account is rate limited')
-            error.code = 'CLAUDE_DEDICATED_RATE_LIMITED'
-            error.accountId = boundAccount.id
-            error.rateLimitEndAt = rateInfo?.rateLimitEndAt || boundAccount.rateLimitEndAt || null
-            throw error
-          }
-
-          if (!this._isSchedulable(boundAccount.schedulable)) {
+          // 检查是否临时不可用
+          const isTempUnavailable = await this.isAccountTemporarilyUnavailable(
+            boundAccount.id,
+            'claude-official'
+          )
+          if (isTempUnavailable) {
             logger.warn(
-              `⚠️ Bound Claude OAuth account ${apiKeyData.claudeAccountId} is not schedulable (schedulable: ${boundAccount?.schedulable}), falling back to pool`
+              `⏱️ Bound Claude OAuth account ${boundAccount.id} is temporarily unavailable, falling back to pool`
             )
           } else {
-            if (isOpusRequest) {
-              await claudeAccountService.clearExpiredOpusRateLimit(boundAccount.id)
+            const isRateLimited = await claudeAccountService.isAccountRateLimited(boundAccount.id)
+            if (isRateLimited) {
+              const rateInfo = await claudeAccountService.getAccountRateLimitInfo(boundAccount.id)
+              const error = new Error('Dedicated Claude account is rate limited')
+              error.code = 'CLAUDE_DEDICATED_RATE_LIMITED'
+              error.accountId = boundAccount.id
+              error.rateLimitEndAt = rateInfo?.rateLimitEndAt || boundAccount.rateLimitEndAt || null
+              throw error
             }
-            logger.info(
-              `🎯 Using bound dedicated Claude OAuth account: ${boundAccount.name} (${apiKeyData.claudeAccountId}) for API key ${apiKeyData.name}`
-            )
-            return {
-              accountId: apiKeyData.claudeAccountId,
-              accountType: 'claude-official'
+
+            if (!this._isSchedulable(boundAccount.schedulable)) {
+              logger.warn(
+                `⚠️ Bound Claude OAuth account ${apiKeyData.claudeAccountId} is not schedulable (schedulable: ${boundAccount?.schedulable}), falling back to pool`
+              )
+            } else {
+              if (isOpusRequest) {
+                await claudeAccountService.clearExpiredOpusRateLimit(boundAccount.id)
+              }
+              logger.info(
+                `🎯 Using bound dedicated Claude OAuth account: ${boundAccount.name} (${apiKeyData.claudeAccountId}) for API key ${apiKeyData.name}`
+              )
+              return {
+                accountId: apiKeyData.claudeAccountId,
+                accountType: 'claude-official'
+              }
             }
           }
         } else {
@@ -221,12 +273,23 @@ class UnifiedClaudeScheduler {
           boundConsoleAccount.status === 'active' &&
           this._isSchedulable(boundConsoleAccount.schedulable)
         ) {
-          logger.info(
-            `🎯 Using bound dedicated Claude Console account: ${boundConsoleAccount.name} (${apiKeyData.claudeConsoleAccountId}) for API key ${apiKeyData.name}`
+          // 检查是否临时不可用
+          const isTempUnavailable = await this.isAccountTemporarilyUnavailable(
+            boundConsoleAccount.id,
+            'claude-console'
           )
-          return {
-            accountId: apiKeyData.claudeConsoleAccountId,
-            accountType: 'claude-console'
+          if (isTempUnavailable) {
+            logger.warn(
+              `⏱️ Bound Claude Console account ${boundConsoleAccount.id} is temporarily unavailable, falling back to pool`
+            )
+          } else {
+            logger.info(
+              `🎯 Using bound dedicated Claude Console account: ${boundConsoleAccount.name} (${apiKeyData.claudeConsoleAccountId}) for API key ${apiKeyData.name}`
+            )
+            return {
+              accountId: apiKeyData.claudeConsoleAccountId,
+              accountType: 'claude-console'
+            }
           }
         } else {
           logger.warn(
@@ -245,12 +308,23 @@ class UnifiedClaudeScheduler {
           boundBedrockAccountResult.data.isActive === true &&
           this._isSchedulable(boundBedrockAccountResult.data.schedulable)
         ) {
-          logger.info(
-            `🎯 Using bound dedicated Bedrock account: ${boundBedrockAccountResult.data.name} (${apiKeyData.bedrockAccountId}) for API key ${apiKeyData.name}`
+          // 检查是否临时不可用
+          const isTempUnavailable = await this.isAccountTemporarilyUnavailable(
+            apiKeyData.bedrockAccountId,
+            'bedrock'
           )
-          return {
-            accountId: apiKeyData.bedrockAccountId,
-            accountType: 'bedrock'
+          if (isTempUnavailable) {
+            logger.warn(
+              `⏱️ Bound Bedrock account ${apiKeyData.bedrockAccountId} is temporarily unavailable, falling back to pool`
+            )
+          } else {
+            logger.info(
+              `🎯 Using bound dedicated Bedrock account: ${boundBedrockAccountResult.data.name} (${apiKeyData.bedrockAccountId}) for API key ${apiKeyData.name}`
+            )
+            return {
+              accountId: apiKeyData.bedrockAccountId,
+              accountType: 'bedrock'
+            }
           }
         } else {
           logger.warn(
@@ -496,6 +570,18 @@ class UnifiedClaudeScheduler {
           continue
         }
 
+        // 检查是否临时不可用
+        const isTempUnavailable = await this.isAccountTemporarilyUnavailable(
+          account.id,
+          'claude-official'
+        )
+        if (isTempUnavailable) {
+          logger.debug(
+            `⏭️ Skipping Claude Official account ${account.name} - temporarily unavailable`
+          )
+          continue
+        }
+
         // 检查是否被限流
         const isRateLimited = await claudeAccountService.isAccountRateLimited(account.id)
         if (isRateLimited) {
@@ -584,6 +670,18 @@ class UnifiedClaudeScheduler {
           // 继续处理该账号
         }
 
+        // 检查是否临时不可用
+        const isTempUnavailable = await this.isAccountTemporarilyUnavailable(
+          currentAccount.id,
+          'claude-console'
+        )
+        if (isTempUnavailable) {
+          logger.debug(
+            `⏭️ Skipping Claude Console account ${currentAccount.name} - temporarily unavailable`
+          )
+          continue
+        }
+
         // 检查是否被限流
         const isRateLimited = await claudeConsoleAccountService.isAccountRateLimited(
           currentAccount.id
@@ -682,7 +780,15 @@ class UnifiedClaudeScheduler {
           account.accountType === 'shared' &&
           this._isSchedulable(account.schedulable)
         ) {
-          // 检查是否可调度
+          // 检查是否临时不可用
+          const isTempUnavailable = await this.isAccountTemporarilyUnavailable(
+            account.id,
+            'bedrock'
+          )
+          if (isTempUnavailable) {
+            logger.debug(`⏭️ Skipping Bedrock account ${account.name} - temporarily unavailable`)
+            continue
+          }
 
           availableAccounts.push({
             ...account,
@@ -731,6 +837,13 @@ class UnifiedClaudeScheduler {
             continue
           }
 
+          // 检查是否临时不可用
+          const isTempUnavailable = await this.isAccountTemporarilyUnavailable(account.id, 'ccr')
+          if (isTempUnavailable) {
+            logger.debug(`⏭️ Skipping CCR account ${account.name} - temporarily unavailable`)
+            continue
+          }
+
           // 检查是否被限流
           const isRateLimited = await ccrAccountService.isAccountRateLimited(account.id)
           const isQuotaExceeded = await ccrAccountService.isAccountQuotaExceeded(account.id)
@@ -1099,6 +1212,42 @@ class UnifiedClaudeScheduler {
     }
   }
 
+  // ⏱️ 标记账户为临时不可用状态（用于5xx等临时故障，默认5分钟后自动恢复）
+  async markAccountTemporarilyUnavailable(
+    accountId,
+    accountType,
+    sessionHash = null,
+    ttlSeconds = 300
+  ) {
+    try {
+      const client = redis.getClientSafe()
+      const key = `temp_unavailable:${accountType}:${accountId}`
+      await client.setex(key, ttlSeconds, '1')
+      if (sessionHash) {
+        await this._deleteSessionMapping(sessionHash)
+      }
+      logger.warn(
+        `⏱️ Account ${accountId} (${accountType}) marked temporarily unavailable for ${ttlSeconds}s`
+      )
+      return { success: true }
+    } catch (error) {
+      logger.error(`❌ Failed to mark account temporarily unavailable: ${accountId}`, error)
+      return { success: false }
+    }
+  }
+
+  // 🔍 检查账户是否临时不可用
+  async isAccountTemporarilyUnavailable(accountId, accountType) {
+    try {
+      const client = redis.getClientSafe()
+      const key = `temp_unavailable:${accountType}:${accountId}`
+      return (await client.exists(key)) === 1
+    } catch (error) {
+      logger.error(`❌ Failed to check temp unavailable status: ${accountId}`, error)
+      return false
+    }
+  }
+
   // 🚫 标记账户为限流状态
   async markAccountRateLimited(
     accountId,
diff --git a/src/utils/modelHelper.js b/src/utils/modelHelper.js
index cc954cc2..a42ee317 100644
--- a/src/utils/modelHelper.js
+++ b/src/utils/modelHelper.js
@@ -70,9 +70,119 @@ function getVendorType(modelStr) {
   return vendor
 }
 
+/**
+ * Check if the model is Opus 4.5 or newer.
+ *
+ * VERSION LOGIC (as of 2025-12-05):
+ * - Opus 4.5+ (including 5.0, 6.0, etc.) → returns true (Pro account eligible)
+ * - Opus 4.4 and below (including 3.x, 4.0, 4.1) → returns false (Max account only)
+ *
+ * Supported naming formats:
+ *   - New format: claude-opus-{major}[-{minor}][-date], e.g., claude-opus-4-5-20251101
+ *   - New format: claude-opus-{major}.{minor}, e.g., claude-opus-4.5
+ *   - Old format: claude-{version}-opus[-date], e.g., claude-3-opus-20240229
+ *   - Special: opus-latest, claude-opus-latest → always returns true
+ *
+ * @param {string} modelName - Model name
+ * @returns {boolean} - Whether the model is Opus 4.5 or newer
+ */
+function isOpus45OrNewer(modelName) {
+  if (!modelName) {
+    return false
+  }
+
+  const lowerModel = modelName.toLowerCase()
+  if (!lowerModel.includes('opus')) {
+    return false
+  }
+
+  // Handle 'latest' special case
+  if (lowerModel.includes('opus-latest') || lowerModel.includes('opus_latest')) {
+    return true
+  }
+
+  // Old format: claude-{version}-opus (version before opus)
+  // e.g., claude-3-opus-20240229, claude-3.5-opus
+  const oldFormatMatch = lowerModel.match(/claude[- ](\d+)(?:[.-](\d+))?[- ]opus/)
+  if (oldFormatMatch) {
+    const majorVersion = parseInt(oldFormatMatch[1], 10)
+    const minorVersion = oldFormatMatch[2] ? parseInt(oldFormatMatch[2], 10) : 0
+
+    // Old format version refers to Claude major version
+    // majorVersion > 4: 5.x, 6.x, ... → true
+    // majorVersion === 4 && minorVersion >= 5: 4.5, 4.6, ... → true
+    // Others (3.x, 4.0-4.4): → false
+    if (majorVersion > 4) {
+      return true
+    }
+    if (majorVersion === 4 && minorVersion >= 5) {
+      return true
+    }
+    return false
+  }
+
+  // New format 1: opus-{major}.{minor} (dot-separated)
+  // e.g., claude-opus-4.5, opus-4.5
+  const dotFormatMatch = lowerModel.match(/opus[- ]?(\d+)\.(\d+)/)
+  if (dotFormatMatch) {
+    const majorVersion = parseInt(dotFormatMatch[1], 10)
+    const minorVersion = parseInt(dotFormatMatch[2], 10)
+
+    // Same version logic as old format
+    // opus-5.0, opus-6.0 → true
+    // opus-4.5, opus-4.6 → true
+    // opus-4.0, opus-4.4 → false
+    if (majorVersion > 4) {
+      return true
+    }
+    if (majorVersion === 4 && minorVersion >= 5) {
+      return true
+    }
+    return false
+  }
+
+  // New format 2: opus-{major}[-{minor}][-date] (hyphen-separated)
+  // e.g., claude-opus-4-5-20251101, claude-opus-4-20250514, claude-opus-4-1-20250805
+  // If opus-{major} is followed by 8-digit date, there's no minor version
+
+  // Extract content after 'opus'
+  const opusIndex = lowerModel.indexOf('opus')
+  const afterOpus = lowerModel.substring(opusIndex + 4)
+
+  // Match: -{major}-{minor}-{date} or -{major}-{date} or -{major}
+  // IMPORTANT: Minor version regex is (\d{1,2}) not (\d+)
+  // This prevents matching 8-digit dates as minor version
+  // Example: opus-4-20250514 → major=4, minor=undefined (not 20250514)
+  // Example: opus-4-5-20251101 → major=4, minor=5
+  // Future-proof: Supports up to 2-digit minor versions (0-99)
+  const versionMatch = afterOpus.match(/^[- ](\d+)(?:[- ](\d{1,2})(?=[- ]\d{8}|$))?/)
+
+  if (versionMatch) {
+    const majorVersion = parseInt(versionMatch[1], 10)
+    const minorVersion = versionMatch[2] ? parseInt(versionMatch[2], 10) : 0
+
+    // Same version logic: >= 4.5 returns true
+    // opus-5-0-date, opus-6-date → true
+    // opus-4-5-date, opus-4-10-date → true (supports 2-digit minor)
+    // opus-4-date (no minor, treated as 4.0) → false
+    // opus-4-1-date, opus-4-4-date → false
+    if (majorVersion > 4) {
+      return true
+    }
+    if (majorVersion === 4 && minorVersion >= 5) {
+      return true
+    }
+    return false
+  }
+
+  // Other cases containing 'opus' but cannot parse version, assume legacy
+  return false
+}
+
 module.exports = {
   parseVendorPrefixedModel,
   hasVendorPrefix,
   getEffectiveModel,
-  getVendorType
+  getVendorType,
+  isOpus45OrNewer
 }
diff --git a/src/utils/unstableUpstreamHelper.js b/src/utils/unstableUpstreamHelper.js
new file mode 100644
index 00000000..6fa58aca
--- /dev/null
+++ b/src/utils/unstableUpstreamHelper.js
@@ -0,0 +1,81 @@
+const logger = require('./logger')
+
+function parseList(envValue) {
+  if (!envValue) {
+    return []
+  }
+  return envValue
+    .split(',')
+    .map((s) => s.trim().toLowerCase())
+    .filter(Boolean)
+}
+
+const unstableTypes = new Set(parseList(process.env.UNSTABLE_ERROR_TYPES))
+const unstableKeywords = parseList(process.env.UNSTABLE_ERROR_KEYWORDS)
+const unstableStatusCodes = new Set([408, 499, 502, 503, 504, 522])
+
+function normalizeErrorPayload(payload) {
+  if (!payload) {
+    return {}
+  }
+
+  if (typeof payload === 'string') {
+    try {
+      return normalizeErrorPayload(JSON.parse(payload))
+    } catch (e) {
+      return { message: payload }
+    }
+  }
+
+  if (payload.error && typeof payload.error === 'object') {
+    return {
+      type: payload.error.type || payload.error.error || payload.error.code,
+      code: payload.error.code || payload.error.error || payload.error.type,
+      message: payload.error.message || payload.error.msg || payload.message || payload.error.error
+    }
+  }
+
+  return {
+    type: payload.type || payload.code,
+    code: payload.code || payload.type,
+    message: payload.message || ''
+  }
+}
+
+function isUnstableUpstreamError(statusCode, payload) {
+  const normalizedStatus = Number(statusCode)
+  if (Number.isFinite(normalizedStatus) && normalizedStatus >= 500) {
+    return true
+  }
+  if (Number.isFinite(normalizedStatus) && unstableStatusCodes.has(normalizedStatus)) {
+    return true
+  }
+
+  const { type, code, message } = normalizeErrorPayload(payload)
+  const lowerType = (type || '').toString().toLowerCase()
+  const lowerCode = (code || '').toString().toLowerCase()
+  const lowerMessage = (message || '').toString().toLowerCase()
+
+  if (lowerType === 'server_error' || lowerCode === 'server_error') {
+    return true
+  }
+  if (unstableTypes.has(lowerType) || unstableTypes.has(lowerCode)) {
+    return true
+  }
+  if (unstableKeywords.length > 0) {
+    return unstableKeywords.some((kw) => lowerMessage.includes(kw))
+  }
+
+  return false
+}
+
+function logUnstable(accountLabel, statusCode) {
+  logger.warn(
+    `Detected unstable upstream error (${statusCode}) for account ${accountLabel}, marking temporarily unavailable`
+  )
+}
+
+module.exports = {
+  isUnstableUpstreamError,
+  logUnstable
+}
diff --git a/web/admin-spa/src/components/accounts/AccountUsageDetailModal.vue b/web/admin-spa/src/components/accounts/AccountUsageDetailModal.vue
index f9b6083c..09da703b 100644
--- a/web/admin-spa/src/components/accounts/AccountUsageDetailModal.vue
+++ b/web/admin-spa/src/components/accounts/AccountUsageDetailModal.vue
@@ -44,12 +44,20 @@
               </p>
             </div>
           </div>
-          <button
-            class="flex h-10 w-10 items-center justify-center rounded-full bg-gray-100 text-gray-500 transition hover:bg-gray-200 hover:text-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200"
-            @click="handleClose"
-          >
-            <i class="fas fa-times" />
-          </button>
+          <div class="flex items-center gap-2">
+            <button
+              class="flex items-center gap-2 rounded-full bg-purple-100 px-3 py-2 text-xs font-semibold text-purple-700 transition hover:bg-purple-200 dark:bg-purple-500/10 dark:text-purple-200 dark:hover:bg-purple-500/20"
+              @click="goTimeline"
+            >
+              <i class="fas fa-clock" /> 请求时间线
+            </button>
+            <button
+              class="flex h-10 w-10 items-center justify-center rounded-full bg-gray-100 text-gray-500 transition hover:bg-gray-200 hover:text-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200"
+              @click="handleClose"
+            >
+              <i class="fas fa-times" />
+            </button>
+          </div>
         </div>
 
         <!-- 内容区域 -->
@@ -325,6 +333,7 @@
 
 <script setup>
 import { computed, nextTick, onUnmounted, ref, watch } from 'vue'
+import { useRouter } from 'vue-router'
 import { storeToRefs } from 'pinia'
 import Chart from 'chart.js/auto'
 import { useThemeStore } from '@/stores/theme'
@@ -343,6 +352,7 @@ const emit = defineEmits(['close'])
 
 const themeStore = useThemeStore()
 const { isDarkMode } = storeToRefs(themeStore)
+const router = useRouter()
 
 const chartCanvas = ref(null)
 let chartInstance = null
@@ -579,6 +589,14 @@ const handleClose = () => {
   emit('close')
 }
 
+const goTimeline = () => {
+  if (!props.account?.id) return
+  router.push({
+    path: `/accounts/${props.account.id}/usage-records`,
+    query: { platform: props.account.platform || props.account.accountType }
+  })
+}
+
 watch(
   () => props.show,
   (visible) => {
diff --git a/web/admin-spa/src/components/apikeys/RecordDetailModal.vue b/web/admin-spa/src/components/apikeys/RecordDetailModal.vue
new file mode 100644
index 00000000..6a4b6482
--- /dev/null
+++ b/web/admin-spa/src/components/apikeys/RecordDetailModal.vue
@@ -0,0 +1,211 @@
+<template>
+  <el-dialog
+    :append-to-body="true"
+    class="record-detail-modal"
+    :close-on-click-modal="false"
+    :destroy-on-close="true"
+    :model-value="show"
+    :show-close="false"
+    top="10vh"
+    width="720px"
+    @close="emitClose"
+  >
+    <template #header>
+      <div class="flex items-center justify-between">
+        <div>
+          <p class="text-xs font-medium uppercase tracking-wide text-gray-500 dark:text-gray-400">
+            请求详情
+          </p>
+          <p class="text-lg font-bold text-gray-900 dark:text-gray-100">
+            {{ record?.model || '未知模型' }}
+          </p>
+        </div>
+        <button
+          aria-label="关闭"
+          class="rounded-full p-2 text-gray-500 transition hover:bg-gray-100 hover:text-gray-700 dark:text-gray-300 dark:hover:bg-gray-800 dark:hover:text-gray-100"
+          @click="emitClose"
+        >
+          <i class="fas fa-times" />
+        </button>
+      </div>
+    </template>
+
+    <div class="space-y-4">
+      <div class="grid gap-3 md:grid-cols-2">
+        <div
+          class="rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-800 dark:bg-gray-900"
+        >
+          <h4 class="mb-3 text-sm font-semibold text-gray-800 dark:text-gray-200">基本信息</h4>
+          <ul class="space-y-2 text-sm text-gray-700 dark:text-gray-300">
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">时间</span>
+              <span class="font-medium">{{ formattedTime }}</span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">模型</span>
+              <span class="font-medium">{{ record?.model || '未知模型' }}</span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">账户</span>
+              <span class="font-medium">{{ record?.accountName || '未知账户' }}</span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">渠道</span>
+              <span class="font-medium">{{ record?.accountTypeName || '未知渠道' }}</span>
+            </li>
+          </ul>
+        </div>
+
+        <div
+          class="rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-800 dark:bg-gray-900"
+        >
+          <h4 class="mb-3 text-sm font-semibold text-gray-800 dark:text-gray-200">Token 使用</h4>
+          <ul class="space-y-2 text-sm text-gray-700 dark:text-gray-300">
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">输入 Token</span>
+              <span class="font-semibold text-blue-600 dark:text-blue-400">
+                {{ formatNumber(record?.inputTokens) }}
+              </span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">输出 Token</span>
+              <span class="font-semibold text-green-600 dark:text-green-400">
+                {{ formatNumber(record?.outputTokens) }}
+              </span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">缓存创建</span>
+              <span class="font-semibold text-purple-600 dark:text-purple-400">
+                {{ formatNumber(record?.cacheCreateTokens) }}
+              </span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">缓存读取</span>
+              <span class="font-semibold text-orange-600 dark:text-orange-400">
+                {{ formatNumber(record?.cacheReadTokens) }}
+              </span>
+            </li>
+            <li class="flex items-center justify-between">
+              <span class="text-gray-500 dark:text-gray-400">总计</span>
+              <span class="font-semibold text-gray-900 dark:text-gray-100">
+                {{ formatNumber(record?.totalTokens) }}
+              </span>
+            </li>
+          </ul>
+        </div>
+      </div>
+
+      <div
+        class="rounded-lg border border-gray-200 bg-white p-4 dark:border-gray-800 dark:bg-gray-900"
+      >
+        <h4 class="mb-3 text-sm font-semibold text-gray-800 dark:text-gray-200">费用详情</h4>
+        <div class="grid gap-3 sm:grid-cols-2">
+          <div
+            class="flex items-center justify-between rounded-md bg-gray-50 px-3 py-2 dark:bg-gray-800"
+          >
+            <span class="text-sm text-gray-500 dark:text-gray-400">输入费用</span>
+            <span class="text-sm font-semibold text-gray-900 dark:text-gray-100">
+              {{ formattedCosts.input }}
+            </span>
+          </div>
+          <div
+            class="flex items-center justify-between rounded-md bg-gray-50 px-3 py-2 dark:bg-gray-800"
+          >
+            <span class="text-sm text-gray-500 dark:text-gray-400">输出费用</span>
+            <span class="text-sm font-semibold text-gray-900 dark:text-gray-100">
+              {{ formattedCosts.output }}
+            </span>
+          </div>
+          <div
+            class="flex items-center justify-between rounded-md bg-gray-50 px-3 py-2 dark:bg-gray-800"
+          >
+            <span class="text-sm text-gray-500 dark:text-gray-400">缓存创建</span>
+            <span class="text-sm font-semibold text-gray-900 dark:text-gray-100">
+              {{ formattedCosts.cacheCreate }}
+            </span>
+          </div>
+          <div
+            class="flex items-center justify-between rounded-md bg-gray-50 px-3 py-2 dark:bg-gray-800"
+          >
+            <span class="text-sm text-gray-500 dark:text-gray-400">缓存读取</span>
+            <span class="text-sm font-semibold text-gray-900 dark:text-gray-100">
+              {{ formattedCosts.cacheRead }}
+            </span>
+          </div>
+        </div>
+        <div
+          class="mt-4 flex items-center justify-between rounded-md border border-gray-200 bg-gray-50 px-4 py-3 dark:border-gray-800 dark:bg-gray-800"
+        >
+          <span class="text-sm font-semibold text-gray-700 dark:text-gray-200">总费用</span>
+          <div class="text-base font-bold text-yellow-600 dark:text-yellow-400">
+            {{ record?.costFormatted || formattedCosts.total }}
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="flex justify-end">
+        <el-button type="primary" @click="emitClose">关闭</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import dayjs from 'dayjs'
+import { formatNumber } from '@/utils/format'
+
+const props = defineProps({
+  show: {
+    type: Boolean,
+    default: false
+  },
+  record: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+const emit = defineEmits(['close'])
+const emitClose = () => emit('close')
+
+const formattedTime = computed(() => {
+  if (!props.record?.timestamp) return '未知时间'
+  return dayjs(props.record.timestamp).format('YYYY-MM-DD HH:mm:ss')
+})
+
+const formattedCosts = computed(() => {
+  const breakdown = props.record?.costBreakdown || {}
+  const formatValue = (value) => {
+    const num = typeof value === 'number' ? value : 0
+    if (num >= 1) return `$${num.toFixed(2)}`
+    if (num >= 0.001) return `$${num.toFixed(4)}`
+    return `$${num.toFixed(6)}`
+  }
+
+  return {
+    input: formatValue(breakdown.input),
+    output: formatValue(breakdown.output),
+    cacheCreate: formatValue(breakdown.cacheCreate),
+    cacheRead: formatValue(breakdown.cacheRead),
+    total: formatValue(breakdown.total)
+  }
+})
+</script>
+
+<style scoped>
+.record-detail-modal :deep(.el-dialog__header) {
+  margin: 0;
+  padding: 16px 16px 0;
+}
+
+.record-detail-modal :deep(.el-dialog__body) {
+  padding: 12px 16px 4px;
+}
+
+.record-detail-modal :deep(.el-dialog__footer) {
+  padding: 8px 16px 16px;
+}
+</style>
diff --git a/web/admin-spa/src/components/apikeys/UsageDetailModal.vue b/web/admin-spa/src/components/apikeys/UsageDetailModal.vue
index 905f1581..846263f2 100644
--- a/web/admin-spa/src/components/apikeys/UsageDetailModal.vue
+++ b/web/admin-spa/src/components/apikeys/UsageDetailModal.vue
@@ -231,6 +231,9 @@
 
         <!-- 底部按钮 -->
         <div class="mt-4 flex justify-end gap-2 sm:mt-6 sm:gap-3">
+          <button class="btn btn-primary px-4 py-2 text-sm" type="button" @click="openTimeline">
+            查看请求时间线
+          </button>
           <button class="btn btn-secondary px-4 py-2 text-sm" type="button" @click="close">
             关闭
           </button>
@@ -256,7 +259,7 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['close'])
+const emit = defineEmits(['close', 'open-timeline'])
 
 // 计算属性
 const totalRequests = computed(() => props.apiKey.usage?.total?.requests || 0)
@@ -320,6 +323,10 @@ const formatTokenCount = (count) => {
 const close = () => {
   emit('close')
 }
+
+const openTimeline = () => {
+  emit('open-timeline', props.apiKey?.id)
+}
 </script>
 
 <style scoped>
diff --git a/web/admin-spa/src/components/common/ActionDropdown.vue b/web/admin-spa/src/components/common/ActionDropdown.vue
index 64ba3423..be7afc46 100644
--- a/web/admin-spa/src/components/common/ActionDropdown.vue
+++ b/web/admin-spa/src/components/common/ActionDropdown.vue
@@ -77,7 +77,21 @@ const getActionClass = (action) => {
   return colorMap[action.color] || colorMap.gray
 }
 
+const instanceId = Symbol('action-dropdown')
+const handleGlobalOpen = (event) => {
+  if (event?.detail?.id !== instanceId) {
+    closeDropdown()
+  }
+}
+
 const toggleDropdown = async () => {
+  if (!isOpen.value) {
+    window.dispatchEvent(
+      new CustomEvent('action-dropdown-open', {
+        detail: { id: instanceId }
+      })
+    )
+  }
   isOpen.value = !isOpen.value
   if (isOpen.value) {
     await nextTick()
@@ -102,7 +116,8 @@ const updateDropdownPosition = () => {
 
   const trigger = triggerRef.value.getBoundingClientRect()
   const dropdownHeight = 200 // 预估高度
-  const dropdownWidth = 160 // 预估宽度
+  const dropdownWidth = 180 // 预估宽度，略大以减少遮挡
+  const gap = 8
   const spaceBelow = window.innerHeight - trigger.bottom
   const spaceAbove = trigger.top
   const spaceRight = window.innerWidth - trigger.right
@@ -112,16 +127,16 @@ const updateDropdownPosition = () => {
 
   // 计算垂直位置
   if (spaceBelow >= dropdownHeight || spaceBelow >= spaceAbove) {
-    top = trigger.bottom + 4
+    top = trigger.bottom + gap
   } else {
-    top = trigger.top - dropdownHeight - 4
+    top = trigger.top - dropdownHeight - gap
   }
 
-  // 计算水平位置 - 优先显示在左侧（因为按钮在右侧固定列）
-  if (spaceLeft >= dropdownWidth) {
-    left = trigger.left - dropdownWidth + trigger.width
-  } else if (spaceRight >= dropdownWidth) {
-    left = trigger.left
+  // 计算水平位置 - 优先向右展开，避免遮挡左侧内容
+  if (spaceRight >= dropdownWidth + gap) {
+    left = trigger.right + gap
+  } else if (spaceLeft >= dropdownWidth + gap) {
+    left = trigger.left - dropdownWidth - gap + trigger.width
   } else {
     left = window.innerWidth - dropdownWidth - 10
   }
@@ -164,11 +179,13 @@ onMounted(() => {
   window.addEventListener('scroll', handleScroll, true)
   window.addEventListener('resize', handleResize)
   document.addEventListener('click', handleClickOutside)
+  window.addEventListener('action-dropdown-open', handleGlobalOpen)
 })
 
 onBeforeUnmount(() => {
   window.removeEventListener('scroll', handleScroll, true)
   window.removeEventListener('resize', handleResize)
   document.removeEventListener('click', handleClickOutside)
+  window.removeEventListener('action-dropdown-open', handleGlobalOpen)
 })
 </script>
diff --git a/web/admin-spa/src/components/common/CustomDropdown.vue b/web/admin-spa/src/components/common/CustomDropdown.vue
index 16ae391d..a555426b 100644
--- a/web/admin-spa/src/components/common/CustomDropdown.vue
+++ b/web/admin-spa/src/components/common/CustomDropdown.vue
@@ -41,19 +41,25 @@
             <div
               v-for="option in options"
               :key="option.value"
-              class="flex cursor-pointer items-center gap-2 whitespace-nowrap px-3 py-2 text-sm transition-colors duration-150"
+              class="flex cursor-pointer items-center gap-2 whitespace-nowrap py-2 text-sm transition-colors duration-150"
               :class="[
-                option.value === modelValue
+                isSelected(option.value)
                   ? 'bg-blue-50 font-medium text-blue-700 dark:bg-blue-900/30 dark:text-blue-400'
-                  : 'text-gray-700 hover:bg-gray-50 dark:text-gray-300 dark:hover:bg-gray-700'
+                  : option.isGroup
+                    ? 'bg-gray-50 font-semibold text-gray-800 dark:bg-gray-700/50 dark:text-gray-200'
+                    : 'text-gray-700 hover:bg-gray-50 dark:text-gray-300 dark:hover:bg-gray-700'
               ]"
+              :style="{
+                paddingLeft: option.indent ? `${12 + option.indent * 16}px` : '12px',
+                paddingRight: '12px'
+              }"
               @click="selectOption(option)"
             >
               <i v-if="option.icon" :class="['fas', option.icon, 'text-xs']"></i>
               <span>{{ option.label }}</span>
               <i
-                v-if="option.value === modelValue"
-                class="fas fa-check ml-auto pl-3 text-xs text-blue-600"
+                v-if="isSelected(option.value)"
+                class="fas fa-check ml-auto pl-3 text-xs text-blue-600 dark:text-blue-400"
               ></i>
             </div>
           </div>
@@ -68,7 +74,7 @@ import { ref, computed, onMounted, onBeforeUnmount, nextTick } from 'vue'
 
 const props = defineProps({
   modelValue: {
-    type: [String, Number],
+    type: [String, Number, Array],
     default: ''
   },
   options: {
@@ -86,6 +92,10 @@ const props = defineProps({
   iconColor: {
     type: String,
     default: 'text-gray-500'
+  },
+  multiple: {
+    type: Boolean,
+    default: false
   }
 })
 
@@ -96,7 +106,18 @@ const triggerRef = ref(null)
 const dropdownRef = ref(null)
 const dropdownStyle = ref({})
 
+const isSelected = (value) => {
+  if (props.multiple) {
+    return Array.isArray(props.modelValue) && props.modelValue.includes(value)
+  }
+  return props.modelValue === value
+}
+
 const selectedLabel = computed(() => {
+  if (props.multiple) {
+    const count = Array.isArray(props.modelValue) ? props.modelValue.length : 0
+    return count > 0 ? `已选 ${count} 个` : ''
+  }
   const selected = props.options.find((opt) => opt.value === props.modelValue)
   return selected ? selected.label : ''
 })
@@ -114,9 +135,21 @@ const closeDropdown = () => {
 }
 
 const selectOption = (option) => {
-  emit('update:modelValue', option.value)
-  emit('change', option.value)
-  closeDropdown()
+  if (props.multiple) {
+    const current = Array.isArray(props.modelValue) ? [...props.modelValue] : []
+    const idx = current.indexOf(option.value)
+    if (idx >= 0) {
+      current.splice(idx, 1)
+    } else {
+      current.push(option.value)
+    }
+    emit('update:modelValue', current)
+    emit('change', current)
+  } else {
+    emit('update:modelValue', option.value)
+    emit('change', option.value)
+    closeDropdown()
+  }
 }
 
 const updateDropdownPosition = () => {
diff --git a/web/admin-spa/src/router/index.js b/web/admin-spa/src/router/index.js
index 16a2b50a..feb67aa1 100644
--- a/web/admin-spa/src/router/index.js
+++ b/web/admin-spa/src/router/index.js
@@ -11,7 +11,9 @@ const UserManagementView = () => import('@/views/UserManagementView.vue')
 const MainLayout = () => import('@/components/layout/MainLayout.vue')
 const DashboardView = () => import('@/views/DashboardView.vue')
 const ApiKeysView = () => import('@/views/ApiKeysView.vue')
+const ApiKeyUsageRecordsView = () => import('@/views/ApiKeyUsageRecordsView.vue')
 const AccountsView = () => import('@/views/AccountsView.vue')
+const AccountUsageRecordsView = () => import('@/views/AccountUsageRecordsView.vue')
 const TutorialView = () => import('@/views/TutorialView.vue')
 const SettingsView = () => import('@/views/SettingsView.vue')
 const ApiStatsView = () => import('@/views/ApiStatsView.vue')
@@ -85,6 +87,18 @@ const routes = [
       }
     ]
   },
+  {
+    path: '/api-keys/:keyId/usage-records',
+    component: MainLayout,
+    meta: { requiresAuth: true },
+    children: [
+      {
+        path: '',
+        name: 'ApiKeyUsageRecords',
+        component: ApiKeyUsageRecordsView
+      }
+    ]
+  },
   {
     path: '/accounts',
     component: MainLayout,
@@ -97,6 +111,18 @@ const routes = [
       }
     ]
   },
+  {
+    path: '/accounts/:accountId/usage-records',
+    component: MainLayout,
+    meta: { requiresAuth: true },
+    children: [
+      {
+        path: '',
+        name: 'AccountUsageRecords',
+        component: AccountUsageRecordsView
+      }
+    ]
+  },
   {
     path: '/tutorial',
     component: MainLayout,
diff --git a/web/admin-spa/src/stores/dashboard.js b/web/admin-spa/src/stores/dashboard.js
index 4e4599ba..76e987b9 100644
--- a/web/admin-spa/src/stores/dashboard.js
+++ b/web/admin-spa/src/stores/dashboard.js
@@ -67,22 +67,72 @@ export const useDashboardStore = defineStore('dashboard', () => {
     groupLabel: 'Claude账户'
   })
 
+  // 本地偏好
+  const STORAGE_KEYS = {
+    preset: 'dashboard:date:preset',
+    granularity: 'dashboard:trend:granularity'
+  }
+  const defaultPreset = 'today'
+  const defaultGranularity = 'day'
+
+  const getPresetOptions = (granularity) =>
+    granularity === 'hour'
+      ? [
+          { value: 'last24h', label: '近24小时', hours: 24 },
+          { value: 'yesterday', label: '昨天', hours: 24 },
+          { value: 'dayBefore', label: '前天', hours: 24 }
+        ]
+      : [
+          { value: 'today', label: '今日', days: 1 },
+          { value: '7days', label: '7天', days: 7 },
+          { value: '30days', label: '30天', days: 30 }
+        ]
+
+  const readFromStorage = (key, fallback) => {
+    try {
+      const value = localStorage.getItem(key)
+      return value || fallback
+    } catch (error) {
+      return fallback
+    }
+  }
+
+  const saveToStorage = (key, value) => {
+    try {
+      localStorage.setItem(key, value)
+    } catch (error) {
+      // 忽略存储错误，避免影响渲染
+    }
+  }
+
+  const normalizePresetForGranularity = (preset, granularity) => {
+    const options = getPresetOptions(granularity)
+    const hasPreset = options.some((opt) => opt.value === preset)
+    if (hasPreset) return preset
+    return granularity === 'hour' ? 'last24h' : defaultPreset
+  }
+
+  const storedGranularity = readFromStorage(STORAGE_KEYS.granularity, defaultGranularity)
+  const initialGranularity = ['day', 'hour'].includes(storedGranularity)
+    ? storedGranularity
+    : defaultGranularity
+  const initialPreset = normalizePresetForGranularity(
+    readFromStorage(STORAGE_KEYS.preset, defaultPreset),
+    initialGranularity
+  )
+
   // 日期筛选
   const dateFilter = ref({
     type: 'preset', // preset 或 custom
-    preset: '7days', // today, 7days, 30days
+    preset: initialPreset, // today, 7days, 30days
     customStart: '',
     customEnd: '',
     customRange: null,
-    presetOptions: [
-      { value: 'today', label: '今日', days: 1 },
-      { value: '7days', label: '7天', days: 7 },
-      { value: '30days', label: '30天', days: 30 }
-    ]
+    presetOptions: getPresetOptions(initialGranularity)
   })
 
   // 趋势图粒度
-  const trendGranularity = ref('day') // 'day' 或 'hour'
+  const trendGranularity = ref(initialGranularity) // 'day' 或 'hour'
   const apiKeysTrendMetric = ref('requests') // 'requests' 或 'tokens'
   const accountUsageGroup = ref('claude') // claude | openai | gemini
 
@@ -138,6 +188,21 @@ export const useDashboardStore = defineStore('dashboard', () => {
     }
   }
 
+  const persistDatePreferences = (
+    preset = dateFilter.value.preset,
+    granularity = trendGranularity.value
+  ) => {
+    saveToStorage(STORAGE_KEYS.preset, preset)
+    saveToStorage(STORAGE_KEYS.granularity, granularity)
+  }
+
+  const getEffectiveGranularity = () =>
+    dateFilter.value.type === 'preset' &&
+    dateFilter.value.preset === 'today' &&
+    trendGranularity.value === 'day'
+      ? 'hour'
+      : trendGranularity.value
+
   // 方法
   async function loadDashboardData(timeRange = null) {
     loading.value = true
@@ -232,7 +297,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
     }
   }
 
-  async function loadUsageTrend(days = 7, granularity = 'day') {
+  async function loadUsageTrend(days = 7, granularity = getEffectiveGranularity()) {
     try {
       let url = '/admin/usage-trend?'
 
@@ -241,26 +306,9 @@ export const useDashboardStore = defineStore('dashboard', () => {
         url += `granularity=hour`
 
         if (dateFilter.value.customRange && dateFilter.value.customRange.length === 2) {
-          // 使用自定义时间范围 - 需要将系统时区时间转换为UTC
-          const convertToUTC = (systemTzTimeStr) => {
-            // 固定使用UTC+8，因为后端系统时区是UTC+8
-            const systemTz = 8
-            // 解析系统时区时间字符串
-            const [datePart, timePart] = systemTzTimeStr.split(' ')
-            const [year, month, day] = datePart.split('-').map(Number)
-            const [hours, minutes, seconds] = timePart.split(':').map(Number)
-
-            // 创建UTC时间，使其在系统时区显示为用户选择的时间
-            // 例如：用户选择 UTC+8 的 2025-07-25 00:00:00
-            // 对应的UTC时间是 2025-07-24 16:00:00
-            const utcDate = new Date(
-              Date.UTC(year, month - 1, day, hours - systemTz, minutes, seconds)
-            )
-            return utcDate.toISOString()
-          }
-
-          url += `&startDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[0]))}`
-          url += `&endDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[1]))}`
+          // 使用自定义时间范围 - 直接按系统时区字符串传递，避免额外时区偏移导致窗口错位
+          url += `&startDate=${encodeURIComponent(dateFilter.value.customRange[0])}`
+          url += `&endDate=${encodeURIComponent(dateFilter.value.customRange[1])}`
         } else {
           // 使用预设计算时间范围，与loadApiKeysTrend保持一致
           const now = new Date()
@@ -268,6 +316,12 @@ export const useDashboardStore = defineStore('dashboard', () => {
 
           if (dateFilter.value.type === 'preset') {
             switch (dateFilter.value.preset) {
+              case 'today': {
+                // 今日：使用系统时区的当日0点-23:59
+                startTime = getSystemTimezoneDay(now, true)
+                endTime = getSystemTimezoneDay(now, false)
+                break
+              }
               case 'last24h': {
                 // 近24小时：从当前时间往前推24小时
                 endTime = new Date(now)
@@ -318,34 +372,28 @@ export const useDashboardStore = defineStore('dashboard', () => {
     }
   }
 
-  async function loadModelStats(period = 'daily') {
+  async function loadModelStats(period = 'daily', granularity = null) {
+    const currentGranularity = granularity || getEffectiveGranularity()
     try {
       let url = `/admin/model-stats?period=${period}`
 
       // 如果是自定义时间范围或小时粒度，传递具体的时间参数
-      if (dateFilter.value.type === 'custom' || trendGranularity.value === 'hour') {
+      if (dateFilter.value.type === 'custom' || currentGranularity === 'hour') {
         if (dateFilter.value.customRange && dateFilter.value.customRange.length === 2) {
-          // 将系统时区时间转换为UTC
-          const convertToUTC = (systemTzTimeStr) => {
-            const systemTz = 8
-            const [datePart, timePart] = systemTzTimeStr.split(' ')
-            const [year, month, day] = datePart.split('-').map(Number)
-            const [hours, minutes, seconds] = timePart.split(':').map(Number)
-
-            const utcDate = new Date(
-              Date.UTC(year, month - 1, day, hours - systemTz, minutes, seconds)
-            )
-            return utcDate.toISOString()
-          }
-
-          url += `&startDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[0]))}`
-          url += `&endDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[1]))}`
-        } else if (trendGranularity.value === 'hour' && dateFilter.value.type === 'preset') {
+          // 按系统时区字符串直传，避免额外时区转换
+          url += `&startDate=${encodeURIComponent(dateFilter.value.customRange[0])}`
+          url += `&endDate=${encodeURIComponent(dateFilter.value.customRange[1])}`
+        } else if (currentGranularity === 'hour' && dateFilter.value.type === 'preset') {
           // 小时粒度的预设时间范围
           const now = new Date()
           let startTime, endTime
 
           switch (dateFilter.value.preset) {
+            case 'today': {
+              startTime = getSystemTimezoneDay(now, true)
+              endTime = getSystemTimezoneDay(now, false)
+              break
+            }
             case 'last24h': {
               endTime = new Date(now)
               startTime = new Date(now.getTime() - 24 * 60 * 60 * 1000)
@@ -374,7 +422,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
           url += `&startDate=${encodeURIComponent(startTime.toISOString())}`
           url += `&endDate=${encodeURIComponent(endTime.toISOString())}`
         }
-      } else if (dateFilter.value.type === 'preset' && trendGranularity.value === 'day') {
+      } else if (dateFilter.value.type === 'preset' && currentGranularity === 'day') {
         // 天粒度的预设时间范围，需要传递startDate和endDate参数
         const now = new Date()
         let startDate, endDate
@@ -409,36 +457,20 @@ export const useDashboardStore = defineStore('dashboard', () => {
     }
   }
 
-  async function loadApiKeysTrend(metric = 'requests') {
+  async function loadApiKeysTrend(metric = 'requests', granularity = null) {
+    const currentGranularity = granularity || getEffectiveGranularity()
     try {
       let url = '/admin/api-keys-usage-trend?'
       let days = 7
 
-      if (trendGranularity.value === 'hour') {
+      if (currentGranularity === 'hour') {
         // 小时粒度，计算时间范围
         url += `granularity=hour`
 
         if (dateFilter.value.customRange && dateFilter.value.customRange.length === 2) {
-          // 使用自定义时间范围 - 需要将系统时区时间转换为UTC
-          const convertToUTC = (systemTzTimeStr) => {
-            // 固定使用UTC+8，因为后端系统时区是UTC+8
-            const systemTz = 8
-            // 解析系统时区时间字符串
-            const [datePart, timePart] = systemTzTimeStr.split(' ')
-            const [year, month, day] = datePart.split('-').map(Number)
-            const [hours, minutes, seconds] = timePart.split(':').map(Number)
-
-            // 创建UTC时间，使其在系统时区显示为用户选择的时间
-            // 例如：用户选择 UTC+8 的 2025-07-25 00:00:00
-            // 对应的UTC时间是 2025-07-24 16:00:00
-            const utcDate = new Date(
-              Date.UTC(year, month - 1, day, hours - systemTz, minutes, seconds)
-            )
-            return utcDate.toISOString()
-          }
-
-          url += `&startDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[0]))}`
-          url += `&endDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[1]))}`
+          // 使用自定义时间范围 - 按系统时区字符串直传
+          url += `&startDate=${encodeURIComponent(dateFilter.value.customRange[0])}`
+          url += `&endDate=${encodeURIComponent(dateFilter.value.customRange[1])}`
         } else {
           // 使用预设计算时间范围，与setDateFilterPreset保持一致
           const now = new Date()
@@ -446,6 +478,11 @@ export const useDashboardStore = defineStore('dashboard', () => {
 
           if (dateFilter.value.type === 'preset') {
             switch (dateFilter.value.preset) {
+              case 'today': {
+                startTime = getSystemTimezoneDay(now, true)
+                endTime = getSystemTimezoneDay(now, false)
+                break
+              }
               case 'last24h': {
                 // 近24小时：从当前时间往前推24小时
                 endTime = new Date(now)
@@ -511,29 +548,18 @@ export const useDashboardStore = defineStore('dashboard', () => {
     }
   }
 
-  async function loadAccountUsageTrend(group = accountUsageGroup.value) {
+  async function loadAccountUsageTrend(group = accountUsageGroup.value, granularity = null) {
+    const currentGranularity = granularity || getEffectiveGranularity()
     try {
       let url = '/admin/account-usage-trend?'
       let days = 7
 
-      if (trendGranularity.value === 'hour') {
+      if (currentGranularity === 'hour') {
         url += `granularity=hour`
 
         if (dateFilter.value.customRange && dateFilter.value.customRange.length === 2) {
-          const convertToUTC = (systemTzTimeStr) => {
-            const systemTz = 8
-            const [datePart, timePart] = systemTzTimeStr.split(' ')
-            const [year, month, day] = datePart.split('-').map(Number)
-            const [hours, minutes, seconds] = timePart.split(':').map(Number)
-
-            const utcDate = new Date(
-              Date.UTC(year, month - 1, day, hours - systemTz, minutes, seconds)
-            )
-            return utcDate.toISOString()
-          }
-
-          url += `&startDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[0]))}`
-          url += `&endDate=${encodeURIComponent(convertToUTC(dateFilter.value.customRange[1]))}`
+          url += `&startDate=${encodeURIComponent(dateFilter.value.customRange[0])}`
+          url += `&endDate=${encodeURIComponent(dateFilter.value.customRange[1])}`
         } else {
           const now = new Date()
           let startTime
@@ -541,6 +567,11 @@ export const useDashboardStore = defineStore('dashboard', () => {
 
           if (dateFilter.value.type === 'preset') {
             switch (dateFilter.value.preset) {
+              case 'today': {
+                startTime = getSystemTimezoneDay(now, true)
+                endTime = getSystemTimezoneDay(now, false)
+                break
+              }
               case 'last24h': {
                 endTime = new Date(now)
                 startTime = new Date(now.getTime() - 24 * 60 * 60 * 1000)
@@ -603,110 +634,87 @@ export const useDashboardStore = defineStore('dashboard', () => {
   }
 
   // 日期筛选相关方法
-  function setDateFilterPreset(preset) {
+  function setDateFilterPreset(preset, options = {}) {
+    const { silent = false, skipSave = false } = options
+    const normalizedPreset = normalizePresetForGranularity(preset, trendGranularity.value)
+
     dateFilter.value.type = 'preset'
-    dateFilter.value.preset = preset
+    dateFilter.value.preset = normalizedPreset
 
-    // 根据预设计算并设置具体的日期范围
-    const option = dateFilter.value.presetOptions.find((opt) => opt.value === preset)
-    if (option) {
-      const now = new Date()
-      let startDate, endDate
+    const option = dateFilter.value.presetOptions.find((opt) => opt.value === normalizedPreset)
+    const now = new Date()
+    let startDate
+    let endDate
 
-      if (trendGranularity.value === 'hour') {
-        // 小时粒度的预设
-        switch (preset) {
-          case 'last24h': {
-            // 近24小时：从当前时间往前推24小时
-            endDate = new Date(now)
-            startDate = new Date(now.getTime() - 24 * 60 * 60 * 1000)
-            break
-          }
-          case 'yesterday': {
-            // 昨天：获取本地时间的昨天
-            const yesterday = new Date()
-            yesterday.setDate(yesterday.getDate() - 1)
-            // 转换为系统时区的昨天0点和23:59
-            startDate = getSystemTimezoneDay(yesterday, true)
-            endDate = getSystemTimezoneDay(yesterday, false)
-            break
-          }
-          case 'dayBefore': {
-            // 前天：获取本地时间的前天
-            const dayBefore = new Date()
-            dayBefore.setDate(dayBefore.getDate() - 2)
-            // 转换为系统时区的前天0点和23:59
-            startDate = getSystemTimezoneDay(dayBefore, true)
-            endDate = getSystemTimezoneDay(dayBefore, false)
-            break
-          }
+    if (trendGranularity.value === 'hour') {
+      switch (normalizedPreset) {
+        case 'today': {
+          startDate = getSystemTimezoneDay(now, true)
+          endDate = getSystemTimezoneDay(now, false)
+          break
         }
-      } else {
-        // 天粒度的预设
-        startDate = new Date(now)
-        endDate = new Date(now)
-
-        if (preset === 'today') {
-          // 今日：从凌晨开始
-          startDate.setHours(0, 0, 0, 0)
-          endDate.setHours(23, 59, 59, 999)
-        } else {
-          // 其他预设：按天数计算
-          startDate.setDate(now.getDate() - (option.days - 1))
-          startDate.setHours(0, 0, 0, 0)
-          endDate.setHours(23, 59, 59, 999)
+        case 'last24h': {
+          endDate = new Date(now)
+          startDate = new Date(now.getTime() - 24 * 60 * 60 * 1000)
+          break
+        }
+        case 'yesterday': {
+          const yesterday = new Date()
+          yesterday.setDate(yesterday.getDate() - 1)
+          startDate = getSystemTimezoneDay(yesterday, true)
+          endDate = getSystemTimezoneDay(yesterday, false)
+          break
+        }
+        case 'dayBefore': {
+          const dayBefore = new Date()
+          dayBefore.setDate(dayBefore.getDate() - 2)
+          startDate = getSystemTimezoneDay(dayBefore, true)
+          endDate = getSystemTimezoneDay(dayBefore, false)
+          break
+        }
+        default: {
+          endDate = new Date(now)
+          startDate = new Date(now.getTime() - 24 * 60 * 60 * 1000)
         }
       }
+    } else {
+      startDate = new Date(now)
+      endDate = new Date(now)
 
-      dateFilter.value.customStart = startDate.toISOString().split('T')[0]
-      dateFilter.value.customEnd = endDate.toISOString().split('T')[0]
-
-      // 设置 customRange 为 Element Plus 需要的格式
-      // 对于小时粒度的昨天/前天，需要特殊处理显示
-      if (trendGranularity.value === 'hour' && (preset === 'yesterday' || preset === 'dayBefore')) {
-        // 获取本地日期
-        const targetDate = new Date()
-        if (preset === 'yesterday') {
-          targetDate.setDate(targetDate.getDate() - 1)
-        } else {
-          targetDate.setDate(targetDate.getDate() - 2)
-        }
-
-        // 显示系统时区的完整一天
-        const year = targetDate.getFullYear()
-        const month = String(targetDate.getMonth() + 1).padStart(2, '0')
-        const day = String(targetDate.getDate()).padStart(2, '0')
-
-        dateFilter.value.customRange = [
-          `${year}-${month}-${day} 00:00:00`,
-          `${year}-${month}-${day} 23:59:59`
-        ]
-      } else {
-        // 其他情况：近24小时或天粒度
-        const formatDateForDisplay = (date) => {
-          // 固定使用UTC+8来显示时间
-          const systemTz = 8
-          const tzOffset = systemTz * 60 * 60 * 1000
-          const localTime = new Date(date.getTime() + tzOffset)
-
-          const year = localTime.getUTCFullYear()
-          const month = String(localTime.getUTCMonth() + 1).padStart(2, '0')
-          const day = String(localTime.getUTCDate()).padStart(2, '0')
-          const hours = String(localTime.getUTCHours()).padStart(2, '0')
-          const minutes = String(localTime.getUTCMinutes()).padStart(2, '0')
-          const seconds = String(localTime.getUTCSeconds()).padStart(2, '0')
-          return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
-        }
-
-        dateFilter.value.customRange = [
-          formatDateForDisplay(startDate),
-          formatDateForDisplay(endDate)
-        ]
+      if (normalizedPreset === 'today') {
+        startDate.setHours(0, 0, 0, 0)
+        endDate.setHours(23, 59, 59, 999)
+      } else if (option?.days) {
+        startDate.setDate(now.getDate() - (option.days - 1))
+        startDate.setHours(0, 0, 0, 0)
+        endDate.setHours(23, 59, 59, 999)
       }
     }
 
-    // 触发数据刷新
-    refreshChartsData()
+    const formatDateForDisplay = (date) => {
+      // 使用本地时间直接格式化，避免多余的时区偏移导致日期错位
+      const localTime = new Date(date)
+      const year = localTime.getFullYear()
+      const month = String(localTime.getMonth() + 1).padStart(2, '0')
+      const day = String(localTime.getDate()).padStart(2, '0')
+      const hours = String(localTime.getHours()).padStart(2, '0')
+      const minutes = String(localTime.getMinutes()).padStart(2, '0')
+      const seconds = String(localTime.getSeconds()).padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+    }
+
+    dateFilter.value.customStart = startDate ? startDate.toISOString().split('T')[0] : ''
+    dateFilter.value.customEnd = endDate ? endDate.toISOString().split('T')[0] : ''
+    dateFilter.value.customRange =
+      startDate && endDate ? [formatDateForDisplay(startDate), formatDateForDisplay(endDate)] : null
+
+    if (!skipSave) {
+      persistDatePreferences(dateFilter.value.preset, trendGranularity.value)
+    }
+
+    if (!silent) {
+      refreshChartsData()
+    }
   }
 
   function onCustomDateRangeChange(value) {
@@ -751,20 +759,17 @@ export const useDashboardStore = defineStore('dashboard', () => {
       refreshChartsData()
     } else if (value === null) {
       // 清空时恢复默认
-      setDateFilterPreset(trendGranularity.value === 'hour' ? 'last24h' : '7days')
+      setDateFilterPreset(trendGranularity.value === 'hour' ? 'last24h' : defaultPreset)
     }
   }
 
-  function setTrendGranularity(granularity) {
+  function setTrendGranularity(granularity, options = {}) {
+    const { silent = false, skipSave = false, presetOverride } = options
     trendGranularity.value = granularity
 
     // 根据粒度更新预设选项
     if (granularity === 'hour') {
-      dateFilter.value.presetOptions = [
-        { value: 'last24h', label: '近24小时', hours: 24 },
-        { value: 'yesterday', label: '昨天', hours: 24 },
-        { value: 'dayBefore', label: '前天', hours: 24 }
-      ]
+      dateFilter.value.presetOptions = getPresetOptions('hour')
 
       // 检查当前自定义日期范围是否超过24小时
       if (
@@ -777,46 +782,53 @@ export const useDashboardStore = defineStore('dashboard', () => {
         const hoursDiff = (end - start) / (1000 * 60 * 60)
         if (hoursDiff > 24) {
           showToast('小时粒度下日期范围不能超过24小时，已切换到近24小时', 'warning')
-          setDateFilterPreset('last24h')
+          setDateFilterPreset('last24h', { silent, skipSave })
           return
         }
       }
-
-      // 如果当前是天粒度的预设，切换到小时粒度的默认预设
-      if (['today', '7days', '30days'].includes(dateFilter.value.preset)) {
-        setDateFilterPreset('last24h')
-        return
-      }
     } else {
       // 天粒度
-      dateFilter.value.presetOptions = [
-        { value: 'today', label: '今日', days: 1 },
-        { value: '7days', label: '7天', days: 7 },
-        { value: '30days', label: '30天', days: 30 }
-      ]
-
-      // 如果当前是小时粒度的预设，切换到天粒度的默认预设
-      if (['last24h', 'yesterday', 'dayBefore'].includes(dateFilter.value.preset)) {
-        setDateFilterPreset('7days')
-        return
-      }
+      dateFilter.value.presetOptions = getPresetOptions('day')
     }
 
-    // 触发数据刷新
-    refreshChartsData()
+    if (dateFilter.value.type === 'custom') {
+      if (!skipSave) {
+        persistDatePreferences(dateFilter.value.preset || defaultPreset, trendGranularity.value)
+      }
+
+      if (!silent) {
+        refreshChartsData()
+      }
+      return
+    }
+
+    const nextPreset =
+      presetOverride ||
+      normalizePresetForGranularity(dateFilter.value.preset, trendGranularity.value)
+
+    setDateFilterPreset(nextPreset, { silent: true, skipSave: true })
+
+    if (!skipSave) {
+      persistDatePreferences(dateFilter.value.preset, trendGranularity.value)
+    }
+
+    if (!silent) {
+      refreshChartsData()
+    }
   }
 
   async function refreshChartsData() {
     // 根据当前筛选条件刷新数据
     let days
     let modelPeriod = 'monthly'
+    const effectiveGranularity = getEffectiveGranularity()
 
     if (dateFilter.value.type === 'preset') {
       const option = dateFilter.value.presetOptions.find(
         (opt) => opt.value === dateFilter.value.preset
       )
 
-      if (trendGranularity.value === 'hour') {
+      if (effectiveGranularity === 'hour') {
         // 小时粒度
         days = 1 // 小时粒度默认查看1天的数据
         modelPeriod = 'daily' // 小时粒度使用日统计
@@ -832,7 +844,7 @@ export const useDashboardStore = defineStore('dashboard', () => {
       }
     } else {
       // 自定义日期范围
-      if (trendGranularity.value === 'hour') {
+      if (effectiveGranularity === 'hour') {
         // 小时粒度下的自定义范围，计算小时数
         const start = new Date(dateFilter.value.customRange[0])
         const end = new Date(dateFilter.value.customRange[1])
@@ -845,16 +857,16 @@ export const useDashboardStore = defineStore('dashboard', () => {
     }
 
     await Promise.all([
-      loadUsageTrend(days, trendGranularity.value),
-      loadModelStats(modelPeriod),
-      loadApiKeysTrend(apiKeysTrendMetric.value),
-      loadAccountUsageTrend(accountUsageGroup.value)
+      loadUsageTrend(days, effectiveGranularity),
+      loadModelStats(modelPeriod, effectiveGranularity),
+      loadApiKeysTrend(apiKeysTrendMetric.value, effectiveGranularity),
+      loadAccountUsageTrend(accountUsageGroup.value, effectiveGranularity)
     ])
   }
 
   function setAccountUsageGroup(group) {
     accountUsageGroup.value = group
-    return loadAccountUsageTrend(group)
+    return loadAccountUsageTrend(group, getEffectiveGranularity())
   }
 
   function calculateDaysBetween(start, end) {
@@ -870,6 +882,10 @@ export const useDashboardStore = defineStore('dashboard', () => {
     return date > new Date()
   }
 
+  // 初始化日期筛选：同步本地偏好并填充范围
+  setDateFilterPreset(dateFilter.value.preset, { silent: true, skipSave: true })
+  persistDatePreferences(dateFilter.value.preset, trendGranularity.value)
+
   return {
     // 状态
     loading,
diff --git a/web/admin-spa/src/views/AccountUsageRecordsView.vue b/web/admin-spa/src/views/AccountUsageRecordsView.vue
new file mode 100644
index 00000000..c813e143
--- /dev/null
+++ b/web/admin-spa/src/views/AccountUsageRecordsView.vue
@@ -0,0 +1,574 @@
+<template>
+  <div class="space-y-4 p-4 lg:p-6">
+    <div class="flex flex-wrap items-center justify-between gap-3">
+      <div class="flex items-center gap-3">
+        <button
+          class="rounded-full border border-gray-200 px-3 py-2 text-sm text-gray-700 transition hover:bg-gray-100 dark:border-gray-700 dark:text-gray-200 dark:hover:bg-gray-800"
+          @click="goBack"
+        >
+          ← 返回
+        </button>
+        <div>
+          <p class="text-xs font-semibold uppercase tracking-wide text-blue-600 dark:text-blue-400">
+            账户请求详情时间线
+          </p>
+          <h2 class="text-xl font-bold text-gray-900 dark:text-gray-100">
+            {{ accountDisplayName }}
+          </h2>
+          <p class="text-xs text-gray-500 dark:text-gray-400">ID: {{ accountId }}</p>
+          <p class="text-xs text-gray-500 dark:text-gray-400">渠道：{{ platformDisplayName }}</p>
+        </div>
+      </div>
+      <div class="flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400">
+        <i class="fas fa-clock text-blue-500" />
+        <span v-if="dateRangeHint">{{ dateRangeHint }}</span>
+        <span v-else>显示近 5000 条记录</span>
+      </div>
+    </div>
+
+    <div class="grid gap-3 md:grid-cols-2 xl:grid-cols-4">
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">总请求</p>
+        <p class="mt-1 text-2xl font-bold text-gray-900 dark:text-gray-100">
+          {{ formatNumber(summary.totalRequests) }}
+        </p>
+      </div>
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">总 Token</p>
+        <p class="mt-1 text-2xl font-bold text-gray-900 dark:text-gray-100">
+          {{ formatNumber(summary.totalTokens) }}
+        </p>
+      </div>
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">总费用</p>
+        <p class="mt-1 text-2xl font-bold text-yellow-600 dark:text-yellow-400">
+          {{ formatCost(summary.totalCost) }}
+        </p>
+      </div>
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">平均费用/次</p>
+        <p class="mt-1 text-2xl font-bold text-gray-900 dark:text-gray-100">
+          {{ formatCost(summary.avgCost) }}
+        </p>
+      </div>
+    </div>
+
+    <div
+      class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+    >
+      <div class="flex flex-wrap items-center gap-3">
+        <el-date-picker
+          v-model="filters.dateRange"
+          class="max-w-[320px]"
+          clearable
+          end-placeholder="结束时间"
+          format="YYYY-MM-DD HH:mm:ss"
+          start-placeholder="开始时间"
+          type="datetimerange"
+          unlink-panels
+          value-format="YYYY-MM-DDTHH:mm:ss[Z]"
+        />
+
+        <el-select
+          v-model="filters.model"
+          class="w-[180px]"
+          clearable
+          filterable
+          placeholder="所有模型"
+        >
+          <el-option
+            v-for="modelOption in availableModels"
+            :key="modelOption"
+            :label="modelOption"
+            :value="modelOption"
+          />
+        </el-select>
+
+        <el-select
+          v-model="filters.apiKeyId"
+          class="w-[220px]"
+          clearable
+          filterable
+          placeholder="所有 API Key"
+        >
+          <el-option
+            v-for="apiKey in availableApiKeys"
+            :key="apiKey.id"
+            :label="apiKey.name || apiKey.id"
+            :value="apiKey.id"
+          />
+        </el-select>
+
+        <el-select v-model="filters.sortOrder" class="w-[140px]" placeholder="排序">
+          <el-option label="时间降序" value="desc" />
+          <el-option label="时间升序" value="asc" />
+        </el-select>
+
+        <el-button @click="resetFilters"> <i class="fas fa-undo mr-2" /> 重置 </el-button>
+        <el-button :loading="exporting" type="primary" @click="exportCsv">
+          <i class="fas fa-file-export mr-2" /> 导出 CSV
+        </el-button>
+      </div>
+    </div>
+
+    <div
+      class="rounded-xl border border-gray-200 bg-white shadow-sm dark:border-gray-800 dark:bg-gray-900"
+    >
+      <div
+        v-if="loading"
+        class="flex items-center justify-center p-10 text-gray-500 dark:text-gray-400"
+      >
+        <i class="fas fa-spinner fa-spin mr-2" /> 加载中...
+      </div>
+      <div v-else>
+        <div
+          v-if="records.length === 0"
+          class="flex flex-col items-center gap-2 p-10 text-gray-500 dark:text-gray-400"
+        >
+          <i class="fas fa-inbox text-2xl" />
+          <p>暂无记录</p>
+        </div>
+        <div v-else class="space-y-4">
+          <div class="hidden overflow-x-auto md:block">
+            <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-800">
+              <thead class="bg-gray-50 dark:bg-gray-800">
+                <tr>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    时间
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    API Key
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    模型
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    输入
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    输出
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    缓存(创/读)
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    总 Token
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    费用
+                  </th>
+                  <th
+                    class="px-4 py-3 text-right text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    操作
+                  </th>
+                </tr>
+              </thead>
+              <tbody
+                class="divide-y divide-gray-200 bg-white dark:divide-gray-800 dark:bg-gray-900"
+              >
+                <tr v-for="record in records" :key="record.timestamp + record.model">
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    {{ formatDate(record.timestamp) }}
+                  </td>
+                  <td class="px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    <div class="flex flex-col">
+                      <span class="font-semibold">
+                        {{ record.apiKeyName || record.apiKeyId || '未知 Key' }}
+                      </span>
+                      <span class="text-xs text-gray-500 dark:text-gray-400">
+                        ID: {{ record.apiKeyId }}
+                      </span>
+                    </div>
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    {{ record.model }}
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-blue-600 dark:text-blue-400">
+                    {{ formatNumber(record.inputTokens) }}
+                  </td>
+                  <td
+                    class="whitespace-nowrap px-4 py-3 text-sm text-green-600 dark:text-green-400"
+                  >
+                    {{ formatNumber(record.outputTokens) }}
+                  </td>
+                  <td
+                    class="whitespace-nowrap px-4 py-3 text-sm text-purple-600 dark:text-purple-400"
+                  >
+                    {{ formatNumber(record.cacheCreateTokens) }} /
+                    {{ formatNumber(record.cacheReadTokens) }}
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    {{ formatNumber(record.totalTokens) }}
+                  </td>
+                  <td
+                    class="whitespace-nowrap px-4 py-3 text-sm text-yellow-600 dark:text-yellow-400"
+                  >
+                    {{ record.costFormatted || formatCost(record.cost) }}
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-right text-sm">
+                    <el-button size="small" @click="openDetail(record)">详情</el-button>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <div class="space-y-3 md:hidden">
+            <div
+              v-for="record in records"
+              :key="record.timestamp + record.model"
+              class="rounded-lg border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+            >
+              <div class="flex items-center justify-between">
+                <div>
+                  <p class="text-sm font-semibold text-gray-900 dark:text-gray-100">
+                    {{ record.apiKeyName || record.apiKeyId || '未知 Key' }}
+                  </p>
+                  <p class="text-xs text-gray-500 dark:text-gray-400">
+                    ID: {{ record.apiKeyId }} · {{ formatDate(record.timestamp) }}
+                  </p>
+                  <p class="text-xs text-gray-500 dark:text-gray-400">
+                    渠道：{{ platformDisplayName }}
+                  </p>
+                </div>
+                <el-button size="small" @click="openDetail(record)">详情</el-button>
+              </div>
+              <div class="mt-3 grid grid-cols-2 gap-2 text-sm text-gray-700 dark:text-gray-300">
+                <div>模型：{{ record.model }}</div>
+                <div>总 Token：{{ formatNumber(record.totalTokens) }}</div>
+                <div>输入：{{ formatNumber(record.inputTokens) }}</div>
+                <div>输出：{{ formatNumber(record.outputTokens) }}</div>
+                <div>
+                  缓存创/读：{{ formatNumber(record.cacheCreateTokens) }} /
+                  {{ formatNumber(record.cacheReadTokens) }}
+                </div>
+                <div class="text-yellow-600 dark:text-yellow-400">
+                  费用：{{ record.costFormatted || formatCost(record.cost) }}
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div class="flex items-center justify-between px-4 pb-4">
+            <div class="text-sm text-gray-500 dark:text-gray-400">
+              共 {{ pagination.totalRecords }} 条记录
+            </div>
+            <el-pagination
+              background
+              :current-page="pagination.currentPage"
+              layout="prev, pager, next, sizes"
+              :page-size="pagination.pageSize"
+              :page-sizes="[20, 50, 100, 200]"
+              :total="pagination.totalRecords"
+              @current-change="handlePageChange"
+              @size-change="handleSizeChange"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <RecordDetailModal :record="activeRecord" :show="detailVisible" @close="closeDetail" />
+  </div>
+</template>
+
+<script setup>
+import { computed, onMounted, reactive, ref, watch } from 'vue'
+import dayjs from 'dayjs'
+import { useRoute, useRouter } from 'vue-router'
+import { apiClient } from '@/config/api'
+import { showToast } from '@/utils/toast'
+import { formatNumber } from '@/utils/format'
+import RecordDetailModal from '@/components/apikeys/RecordDetailModal.vue'
+
+const route = useRoute()
+const router = useRouter()
+
+const accountId = computed(() => route.params.accountId)
+const platform = computed(() => route.query.platform)
+const loading = ref(false)
+const exporting = ref(false)
+const records = ref([])
+const availableModels = ref([])
+const availableApiKeys = ref([])
+
+const pagination = reactive({
+  currentPage: 1,
+  pageSize: 50,
+  totalRecords: 0
+})
+
+const filters = reactive({
+  dateRange: null,
+  model: '',
+  apiKeyId: '',
+  sortOrder: 'desc'
+})
+
+const summary = reactive({
+  totalRequests: 0,
+  totalTokens: 0,
+  totalCost: 0,
+  avgCost: 0
+})
+
+const accountInfo = reactive({
+  id: accountId.value,
+  name: '',
+  platform: platform.value || ''
+})
+
+const detailVisible = ref(false)
+const activeRecord = ref(null)
+
+const accountDisplayName = computed(() => accountInfo.name || accountInfo.id || accountId.value)
+const platformDisplayName = computed(() => {
+  const map = {
+    claude: 'Claude官方',
+    'claude-console': 'Claude Console',
+    ccr: 'Claude Console Relay',
+    openai: 'OpenAI',
+    'openai-responses': 'OpenAI Responses',
+    gemini: 'Gemini',
+    'gemini-api': 'Gemini API',
+    droid: 'Droid',
+    unknown: '未知渠道'
+  }
+  const key = accountInfo.platform || platform.value || 'unknown'
+  return map[key] || '未知渠道'
+})
+
+const dateRangeHint = computed(() => {
+  if (!filters.dateRange || filters.dateRange.length !== 2) return ''
+  return `${formatDate(filters.dateRange[0])} ~ ${formatDate(filters.dateRange[1])}`
+})
+
+const formatDate = (value) => {
+  if (!value) return '--'
+  return dayjs(value).format('YYYY-MM-DD HH:mm:ss')
+}
+
+const formatCost = (value) => {
+  const num = typeof value === 'number' ? value : 0
+  if (num >= 1) return `$${num.toFixed(2)}`
+  if (num >= 0.001) return `$${num.toFixed(4)}`
+  return `$${num.toFixed(6)}`
+}
+
+const buildParams = (page) => {
+  const params = {
+    page,
+    pageSize: pagination.pageSize,
+    sortOrder: filters.sortOrder
+  }
+
+  if (filters.model) params.model = filters.model
+  if (filters.apiKeyId) params.apiKeyId = filters.apiKeyId
+  if (filters.dateRange && filters.dateRange.length === 2) {
+    params.startDate = dayjs(filters.dateRange[0]).toISOString()
+    params.endDate = dayjs(filters.dateRange[1]).toISOString()
+  }
+  if (platform.value) {
+    params.platform = platform.value
+  }
+
+  return params
+}
+
+const syncResponseState = (data) => {
+  records.value = data.records || []
+
+  const pageInfo = data.pagination || {}
+  pagination.currentPage = pageInfo.currentPage || 1
+  pagination.pageSize = pageInfo.pageSize || pagination.pageSize
+  pagination.totalRecords = pageInfo.totalRecords || 0
+
+  const filterEcho = data.filters || {}
+  if (filterEcho.model !== undefined) filters.model = filterEcho.model || ''
+  if (filterEcho.apiKeyId !== undefined) filters.apiKeyId = filterEcho.apiKeyId || ''
+  if (filterEcho.sortOrder) filters.sortOrder = filterEcho.sortOrder
+  if (filterEcho.startDate && filterEcho.endDate) {
+    const nextRange = [filterEcho.startDate, filterEcho.endDate]
+    const currentRange = filters.dateRange || []
+    if (currentRange[0] !== nextRange[0] || currentRange[1] !== nextRange[1]) {
+      filters.dateRange = nextRange
+    }
+  }
+
+  const summaryData = data.summary || {}
+  summary.totalRequests = summaryData.totalRequests || 0
+  summary.totalTokens = summaryData.totalTokens || 0
+  summary.totalCost = summaryData.totalCost || 0
+  summary.avgCost = summaryData.avgCost || 0
+
+  accountInfo.id = data.accountInfo?.id || accountId.value
+  accountInfo.name = data.accountInfo?.name || ''
+  accountInfo.platform = data.accountInfo?.platform || platform.value || ''
+
+  availableModels.value = data.availableFilters?.models || []
+  availableApiKeys.value = data.availableFilters?.apiKeys || []
+}
+
+const fetchRecords = async (page = pagination.currentPage) => {
+  loading.value = true
+  try {
+    const response = await apiClient.get(`/admin/accounts/${accountId.value}/usage-records`, {
+      params: buildParams(page)
+    })
+    syncResponseState(response.data || {})
+  } catch (error) {
+    showToast(`加载请求记录失败：${error.message || '未知错误'}`, 'error')
+  } finally {
+    loading.value = false
+  }
+}
+
+const handlePageChange = (page) => {
+  pagination.currentPage = page
+  fetchRecords(page)
+}
+
+const handleSizeChange = (size) => {
+  pagination.pageSize = size
+  pagination.currentPage = 1
+  fetchRecords(1)
+}
+
+const resetFilters = () => {
+  filters.model = ''
+  filters.apiKeyId = ''
+  filters.dateRange = null
+  filters.sortOrder = 'desc'
+  pagination.currentPage = 1
+  fetchRecords(1)
+}
+
+const openDetail = (record) => {
+  activeRecord.value = record
+  detailVisible.value = true
+}
+
+const closeDetail = () => {
+  detailVisible.value = false
+  activeRecord.value = null
+}
+
+const goBack = () => {
+  router.push('/accounts')
+}
+
+const exportCsv = async () => {
+  if (exporting.value) return
+  exporting.value = true
+  try {
+    const aggregated = []
+    let page = 1
+    let totalPages = 1
+    const maxPages = 50 // 50 * 200 = 10000，超过后端 5000 上限已足够
+
+    while (page <= totalPages && page <= maxPages) {
+      const response = await apiClient.get(`/admin/accounts/${accountId.value}/usage-records`, {
+        params: { ...buildParams(page), pageSize: 200 }
+      })
+      const payload = response.data || {}
+      aggregated.push(...(payload.records || []))
+      totalPages = payload.pagination?.totalPages || 1
+      page += 1
+    }
+
+    if (aggregated.length === 0) {
+      showToast('没有可导出的记录', 'info')
+      return
+    }
+
+    const headers = [
+      '时间',
+      'API Key',
+      '模型',
+      '输入Token',
+      '输出Token',
+      '缓存创建Token',
+      '缓存读取Token',
+      '总Token',
+      '费用'
+    ]
+
+    const csvRows = [headers.join(',')]
+    aggregated.forEach((record) => {
+      const row = [
+        formatDate(record.timestamp),
+        record.apiKeyName || record.apiKeyId || '',
+        record.model || '',
+        record.inputTokens || 0,
+        record.outputTokens || 0,
+        record.cacheCreateTokens || 0,
+        record.cacheReadTokens || 0,
+        record.totalTokens || 0,
+        record.costFormatted || formatCost(record.cost)
+      ]
+      csvRows.push(row.map((cell) => `"${String(cell).replace(/"/g, '""')}"`).join(','))
+    })
+
+    const blob = new Blob([csvRows.join('\n')], {
+      type: 'text/csv;charset=utf-8;'
+    })
+    const url = URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = `account-${accountId.value}-usage-records.csv`
+    link.click()
+    URL.revokeObjectURL(url)
+    showToast('导出 CSV 成功', 'success')
+  } catch (error) {
+    showToast(`导出失败：${error.message || '未知错误'}`, 'error')
+  } finally {
+    exporting.value = false
+  }
+}
+
+watch(
+  () => [filters.model, filters.apiKeyId, filters.sortOrder],
+  () => {
+    pagination.currentPage = 1
+    fetchRecords(1)
+  }
+)
+
+watch(
+  () => filters.dateRange,
+  () => {
+    pagination.currentPage = 1
+    fetchRecords(1)
+  },
+  { deep: true }
+)
+
+onMounted(() => {
+  fetchRecords()
+})
+</script>
diff --git a/web/admin-spa/src/views/AccountsView.vue b/web/admin-spa/src/views/AccountsView.vue
index c2a31013..57b75192 100644
--- a/web/admin-spa/src/views/AccountsView.vue
+++ b/web/admin-spa/src/views/AccountsView.vue
@@ -58,6 +58,20 @@
               />
             </div>
 
+            <!-- 状态筛选器 -->
+            <div class="group relative min-w-[120px]">
+              <div
+                class="absolute -inset-0.5 rounded-lg bg-gradient-to-r from-green-500 to-emerald-500 opacity-0 blur transition duration-300 group-hover:opacity-20"
+              ></div>
+              <CustomDropdown
+                v-model="statusFilter"
+                icon="fa-check-circle"
+                icon-color="text-green-500"
+                :options="statusOptions"
+                placeholder="选择状态"
+              />
+            </div>
+
             <!-- 搜索框 -->
             <div class="group relative min-w-[200px]">
               <div
@@ -83,6 +97,22 @@
           </div>
 
           <div class="flex w-full flex-col gap-3 sm:w-auto sm:flex-row sm:items-center sm:gap-3">
+            <!-- 账户统计按钮 -->
+            <div class="relative">
+              <el-tooltip content="查看账户统计汇总" effect="dark" placement="bottom">
+                <button
+                  class="group relative flex items-center justify-center gap-2 rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 shadow-sm transition-all duration-200 hover:border-gray-300 hover:shadow-md dark:border-gray-600 dark:bg-gray-800 dark:text-gray-300 dark:hover:border-gray-500 sm:w-auto"
+                  @click="showAccountStatsModal = true"
+                >
+                  <div
+                    class="absolute -inset-0.5 rounded-lg bg-gradient-to-r from-violet-500 to-purple-500 opacity-0 blur transition duration-300 group-hover:opacity-20"
+                  ></div>
+                  <i class="fas fa-chart-bar relative text-violet-500" />
+                  <span class="relative">统计</span>
+                </button>
+              </el-tooltip>
+            </div>
+
             <!-- 刷新按钮 -->
             <div class="relative">
               <el-tooltip
@@ -1668,7 +1698,6 @@
               <i class="fas fa-chart-line" />
               详情
             </button>
-
             <button
               v-if="canTestAccount(account)"
               class="flex flex-1 items-center justify-center gap-1 rounded-lg bg-cyan-50 px-3 py-2 text-xs text-cyan-600 transition-colors hover:bg-cyan-100 dark:bg-cyan-900/40 dark:text-cyan-300 dark:hover:bg-cyan-800/50"
@@ -1850,6 +1879,146 @@
       :show="showAccountTestModal"
       @close="closeAccountTestModal"
     />
+
+    <!-- 账户统计弹窗 -->
+    <el-dialog
+      v-model="showAccountStatsModal"
+      :style="{ maxWidth: '1200px' }"
+      title="账户统计汇总"
+      width="90%"
+    >
+      <div class="space-y-4">
+        <div class="overflow-x-auto">
+          <table class="w-full border-collapse text-sm" style="min-width: 1000px">
+            <thead class="bg-gray-100 dark:bg-gray-700">
+              <tr>
+                <th class="border border-gray-300 px-4 py-2 text-left dark:border-gray-600">
+                  平台类型
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  正常
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  不可调度
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  限流0-1h
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  限流1-5h
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  限流5-12h
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  限流12-24h
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  限流>24h
+                </th>
+                <th class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  其他
+                </th>
+                <th
+                  class="border border-gray-300 bg-blue-50 px-4 py-2 text-center font-bold dark:border-gray-600 dark:bg-blue-900/30"
+                >
+                  合计
+                </th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr v-for="stat in accountStats" :key="stat.platform">
+                <td class="border border-gray-300 px-4 py-2 font-medium dark:border-gray-600">
+                  {{ stat.platformLabel }}
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-green-600 dark:text-green-400">{{ stat.normal }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-yellow-600 dark:text-yellow-400">{{ stat.unschedulable }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{ stat.rateLimit0_1h }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{ stat.rateLimit1_5h }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    stat.rateLimit5_12h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    stat.rateLimit12_24h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    stat.rateLimitOver24h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-red-600 dark:text-red-400">{{ stat.other }}</span>
+                </td>
+                <td
+                  class="border border-gray-300 bg-blue-50 px-4 py-2 text-center font-bold dark:border-gray-600 dark:bg-blue-900/30"
+                >
+                  {{ stat.total }}
+                </td>
+              </tr>
+              <tr class="bg-blue-50 font-bold dark:bg-blue-900/30">
+                <td class="border border-gray-300 px-4 py-2 dark:border-gray-600">合计</td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-green-600 dark:text-green-400">{{
+                    accountStatsTotal.normal
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-yellow-600 dark:text-yellow-400">{{
+                    accountStatsTotal.unschedulable
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    accountStatsTotal.rateLimit0_1h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    accountStatsTotal.rateLimit1_5h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    accountStatsTotal.rateLimit5_12h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    accountStatsTotal.rateLimit12_24h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-orange-600 dark:text-orange-400">{{
+                    accountStatsTotal.rateLimitOver24h
+                  }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  <span class="text-red-600 dark:text-red-400">{{ accountStatsTotal.other }}</span>
+                </td>
+                <td class="border border-gray-300 px-4 py-2 text-center dark:border-gray-600">
+                  {{ accountStatsTotal.total }}
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+        <p class="text-sm text-gray-500 dark:text-gray-400">
+          注：限流时间列表示剩余限流时间在指定范围内的账户数量
+        </p>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -1880,6 +2049,7 @@ const bindingCounts = ref({}) // 轻量级绑定计数，用于显示"绑定: X
 const accountGroups = ref([])
 const groupFilter = ref('all')
 const platformFilter = ref('all')
+const statusFilter = ref('normal') // 状态过滤 (normal/rateLimited/other/all)
 const searchKeyword = ref('')
 const PAGE_SIZE_STORAGE_KEY = 'accountsPageSize'
 const getInitialPageSize = () => {
@@ -1929,6 +2099,9 @@ const expiryEditModalRef = ref(null)
 const showAccountTestModal = ref(false)
 const testingAccount = ref(null)
 
+// 账户统计弹窗状态
+const showAccountStatsModal = ref(false)
+
 // 表格横向滚动检测
 const tableContainerRef = ref(null)
 const needsHorizontalScroll = ref(false)
@@ -1946,21 +2119,102 @@ const sortOptions = ref([
   { value: 'dailyTokens', label: '按今日Token排序', icon: 'fa-coins' },
   { value: 'dailyRequests', label: '按今日请求数排序', icon: 'fa-chart-line' },
   { value: 'totalTokens', label: '按总Token排序', icon: 'fa-database' },
-  { value: 'lastUsed', label: '按最后使用排序', icon: 'fa-clock' }
+  { value: 'lastUsed', label: '按最后使用排序', icon: 'fa-clock' },
+  { value: 'rateLimitTime', label: '按限流时间排序', icon: 'fa-hourglass' }
 ])
 
-const platformOptions = ref([
-  { value: 'all', label: '所有平台', icon: 'fa-globe' },
-  { value: 'claude', label: 'Claude', icon: 'fa-brain' },
-  { value: 'claude-console', label: 'Claude Console', icon: 'fa-terminal' },
-  { value: 'gemini', label: 'Gemini', icon: 'fab fa-google' },
-  { value: 'gemini-api', label: 'Gemini API', icon: 'fa-key' },
-  { value: 'openai', label: 'OpenAi', icon: 'fa-openai' },
-  { value: 'azure_openai', label: 'Azure OpenAI', icon: 'fab fa-microsoft' },
-  { value: 'bedrock', label: 'Bedrock', icon: 'fab fa-aws' },
-  { value: 'openai-responses', label: 'OpenAI-Responses', icon: 'fa-server' },
-  { value: 'ccr', label: 'CCR', icon: 'fa-code-branch' },
-  { value: 'droid', label: 'Droid', icon: 'fa-robot' }
+// 平台层级结构定义
+const platformHierarchy = [
+  {
+    value: 'group-claude',
+    label: 'Claude（全部）',
+    icon: 'fa-brain',
+    children: [
+      { value: 'claude', label: 'Claude 官方/OAuth', icon: 'fa-brain' },
+      { value: 'claude-console', label: 'Claude Console', icon: 'fa-terminal' },
+      { value: 'bedrock', label: 'Bedrock', icon: 'fab fa-aws' },
+      { value: 'ccr', label: 'CCR Relay', icon: 'fa-code-branch' }
+    ]
+  },
+  {
+    value: 'group-openai',
+    label: 'Codex / OpenAI（全部）',
+    icon: 'fa-openai',
+    children: [
+      { value: 'openai', label: 'OpenAI 官方', icon: 'fa-openai' },
+      { value: 'openai-responses', label: 'OpenAI-Responses (Codex)', icon: 'fa-server' },
+      { value: 'azure_openai', label: 'Azure OpenAI', icon: 'fab fa-microsoft' }
+    ]
+  },
+  {
+    value: 'group-gemini',
+    label: 'Gemini（全部）',
+    icon: 'fab fa-google',
+    children: [
+      { value: 'gemini', label: 'Gemini OAuth', icon: 'fab fa-google' },
+      { value: 'gemini-api', label: 'Gemini API', icon: 'fa-key' }
+    ]
+  },
+  {
+    value: 'group-droid',
+    label: 'Droid（全部）',
+    icon: 'fa-robot',
+    children: [{ value: 'droid', label: 'Droid', icon: 'fa-robot' }]
+  }
+]
+
+// 平台分组映射
+const platformGroupMap = {
+  'group-claude': ['claude', 'claude-console', 'bedrock', 'ccr'],
+  'group-openai': ['openai', 'openai-responses', 'azure_openai'],
+  'group-gemini': ['gemini', 'gemini-api'],
+  'group-droid': ['droid']
+}
+
+// 平台请求处理器
+const platformRequestHandlers = {
+  claude: (params) => apiClient.get('/admin/claude-accounts', { params }),
+  'claude-console': (params) => apiClient.get('/admin/claude-console-accounts', { params }),
+  bedrock: (params) => apiClient.get('/admin/bedrock-accounts', { params }),
+  gemini: (params) => apiClient.get('/admin/gemini-accounts', { params }),
+  openai: (params) => apiClient.get('/admin/openai-accounts', { params }),
+  azure_openai: (params) => apiClient.get('/admin/azure-openai-accounts', { params }),
+  'openai-responses': (params) => apiClient.get('/admin/openai-responses-accounts', { params }),
+  ccr: (params) => apiClient.get('/admin/ccr-accounts', { params }),
+  droid: (params) => apiClient.get('/admin/droid-accounts', { params }),
+  'gemini-api': (params) => apiClient.get('/admin/gemini-api-accounts', { params })
+}
+
+const allPlatformKeys = Object.keys(platformRequestHandlers)
+
+// 根据过滤器获取需要加载的平台列表
+const getPlatformsForFilter = (filter) => {
+  if (filter === 'all') return allPlatformKeys
+  if (platformGroupMap[filter]) return platformGroupMap[filter]
+  if (allPlatformKeys.includes(filter)) return [filter]
+  return allPlatformKeys
+}
+
+// 平台选项（两级结构）
+const platformOptions = computed(() => {
+  const options = [{ value: 'all', label: '所有平台', icon: 'fa-globe', indent: 0 }]
+
+  platformHierarchy.forEach((group) => {
+    options.push({ ...group, indent: 0, isGroup: true })
+    group.children?.forEach((child) => {
+      options.push({ ...child, indent: 1, parent: group.value })
+    })
+  })
+
+  return options
+})
+
+const statusOptions = ref([
+  { value: 'normal', label: '正常', icon: 'fa-check-circle' },
+  { value: 'unschedulable', label: '不可调度', icon: 'fa-ban' },
+  { value: 'rateLimited', label: '限流', icon: 'fa-hourglass-half' },
+  { value: 'other', label: '其他', icon: 'fa-exclamation-triangle' },
+  { value: 'all', label: '全部状态', icon: 'fa-list' }
 ])
 
 const groupOptions = computed(() => {
@@ -2199,6 +2453,33 @@ const sortedAccounts = computed(() => {
     )
   }
 
+  // 状态过滤 (normal/unschedulable/rateLimited/other/all)
+  // 限流: isActive && rate-limited (最高优先级)
+  // 正常: isActive && !rate-limited && !blocked && schedulable
+  // 不可调度: isActive && !rate-limited && !blocked && schedulable === false
+  // 其他: 非限流的（未激活 || 被阻止）
+  if (statusFilter.value !== 'all') {
+    sourceAccounts = sourceAccounts.filter((account) => {
+      const isRateLimited = isAccountRateLimited(account)
+      const isBlocked = account.status === 'blocked' || account.status === 'unauthorized'
+
+      if (statusFilter.value === 'rateLimited') {
+        // 限流: 激活且限流中（优先判断）
+        return account.isActive && isRateLimited
+      } else if (statusFilter.value === 'normal') {
+        // 正常: 激活且非限流且非阻止且可调度
+        return account.isActive && !isRateLimited && !isBlocked && account.schedulable !== false
+      } else if (statusFilter.value === 'unschedulable') {
+        // 不可调度: 激活且非限流且非阻止但不可调度
+        return account.isActive && !isRateLimited && !isBlocked && account.schedulable === false
+      } else if (statusFilter.value === 'other') {
+        // 其他: 非限流的异常账户（未激活或被阻止）
+        return !isRateLimited && (!account.isActive || isBlocked)
+      }
+      return true
+    })
+  }
+
   if (!accountsSortBy.value) return sourceAccounts
 
   const sorted = [...sourceAccounts].sort((a, b) => {
@@ -2229,6 +2510,23 @@ const sortedAccounts = computed(() => {
       bVal = b.isActive ? 1 : 0
     }
 
+    // 处理限流时间排序: 未限流优先，然后按剩余时间从小到大
+    if (accountsSortBy.value === 'rateLimitTime') {
+      const aIsRateLimited = isAccountRateLimited(a)
+      const bIsRateLimited = isAccountRateLimited(b)
+      const aMinutes = aIsRateLimited ? getRateLimitRemainingMinutes(a) : 0
+      const bMinutes = bIsRateLimited ? getRateLimitRemainingMinutes(b) : 0
+
+      // 未限流的排在前面
+      if (!aIsRateLimited && bIsRateLimited) return -1
+      if (aIsRateLimited && !bIsRateLimited) return 1
+
+      // 都未限流或都限流时，按剩余时间升序
+      if (aMinutes < bMinutes) return -1
+      if (aMinutes > bMinutes) return 1
+      return 0
+    }
+
     if (aVal < bVal) return accountsSortOrder.value === 'asc' ? -1 : 1
     if (aVal > bVal) return accountsSortOrder.value === 'asc' ? 1 : -1
     return 0
@@ -2242,6 +2540,120 @@ const totalPages = computed(() => {
   return Math.ceil(total / pageSize.value) || 0
 })
 
+// 账户统计数据（按平台和状态分类）
+const accountStats = computed(() => {
+  const platforms = [
+    { value: 'claude', label: 'Claude' },
+    { value: 'claude-console', label: 'Claude Console' },
+    { value: 'gemini', label: 'Gemini' },
+    { value: 'gemini-api', label: 'Gemini API' },
+    { value: 'openai', label: 'OpenAI' },
+    { value: 'azure_openai', label: 'Azure OpenAI' },
+    { value: 'bedrock', label: 'Bedrock' },
+    { value: 'openai-responses', label: 'OpenAI-Responses' },
+    { value: 'ccr', label: 'CCR' },
+    { value: 'droid', label: 'Droid' }
+  ]
+
+  return platforms
+    .map((p) => {
+      const platformAccounts = accounts.value.filter((acc) => acc.platform === p.value)
+
+      // 先筛选限流账户（优先级最高）
+      const rateLimitedAccounts = platformAccounts.filter((acc) => isAccountRateLimited(acc))
+
+      // 正常: 非限流 && 激活 && 非阻止 && 可调度
+      const normal = platformAccounts.filter((acc) => {
+        const isRateLimited = isAccountRateLimited(acc)
+        const isBlocked = acc.status === 'blocked' || acc.status === 'unauthorized'
+        return !isRateLimited && acc.isActive && !isBlocked && acc.schedulable !== false
+      }).length
+
+      // 不可调度: 非限流 && 激活 && 非阻止 && 不可调度
+      const unschedulable = platformAccounts.filter((acc) => {
+        const isRateLimited = isAccountRateLimited(acc)
+        const isBlocked = acc.status === 'blocked' || acc.status === 'unauthorized'
+        return !isRateLimited && acc.isActive && !isBlocked && acc.schedulable === false
+      }).length
+
+      // 其他: 非限流的异常账户（未激活或被阻止）
+      const other = platformAccounts.filter((acc) => {
+        const isRateLimited = isAccountRateLimited(acc)
+        const isBlocked = acc.status === 'blocked' || acc.status === 'unauthorized'
+        return !isRateLimited && (!acc.isActive || isBlocked)
+      }).length
+
+      const rateLimit0_1h = rateLimitedAccounts.filter((acc) => {
+        const minutes = getRateLimitRemainingMinutes(acc)
+        return minutes > 0 && minutes <= 60
+      }).length
+
+      const rateLimit1_5h = rateLimitedAccounts.filter((acc) => {
+        const minutes = getRateLimitRemainingMinutes(acc)
+        return minutes > 60 && minutes <= 300
+      }).length
+
+      const rateLimit5_12h = rateLimitedAccounts.filter((acc) => {
+        const minutes = getRateLimitRemainingMinutes(acc)
+        return minutes > 300 && minutes <= 720
+      }).length
+
+      const rateLimit12_24h = rateLimitedAccounts.filter((acc) => {
+        const minutes = getRateLimitRemainingMinutes(acc)
+        return minutes > 720 && minutes <= 1440
+      }).length
+
+      const rateLimitOver24h = rateLimitedAccounts.filter((acc) => {
+        const minutes = getRateLimitRemainingMinutes(acc)
+        return minutes > 1440
+      }).length
+
+      return {
+        platform: p.value,
+        platformLabel: p.label,
+        normal,
+        unschedulable,
+        rateLimit0_1h,
+        rateLimit1_5h,
+        rateLimit5_12h,
+        rateLimit12_24h,
+        rateLimitOver24h,
+        other,
+        total: platformAccounts.length
+      }
+    })
+    .filter((stat) => stat.total > 0) // 只显示有账户的平台
+})
+
+// 账户统计合计
+const accountStatsTotal = computed(() => {
+  return accountStats.value.reduce(
+    (total, stat) => {
+      total.normal += stat.normal
+      total.unschedulable += stat.unschedulable
+      total.rateLimit0_1h += stat.rateLimit0_1h
+      total.rateLimit1_5h += stat.rateLimit1_5h
+      total.rateLimit5_12h += stat.rateLimit5_12h
+      total.rateLimit12_24h += stat.rateLimit12_24h
+      total.rateLimitOver24h += stat.rateLimitOver24h
+      total.other += stat.other
+      total.total += stat.total
+      return total
+    },
+    {
+      normal: 0,
+      unschedulable: 0,
+      rateLimit0_1h: 0,
+      rateLimit1_5h: 0,
+      rateLimit5_12h: 0,
+      rateLimit12_24h: 0,
+      rateLimitOver24h: 0,
+      other: 0,
+      total: 0
+    }
+  )
+})
+
 const pageNumbers = computed(() => {
   const total = totalPages.value
   const current = currentPage.value
@@ -2355,190 +2767,14 @@ const loadAccounts = async (forceReload = false) => {
   try {
     // 构建查询参数（用于其他筛选情况）
     const params = {}
-    if (platformFilter.value !== 'all') {
+    if (platformFilter.value !== 'all' && !platformGroupMap[platformFilter.value]) {
       params.platform = platformFilter.value
     }
     if (groupFilter.value !== 'all') {
       params.groupId = groupFilter.value
     }
 
-    // 根据平台筛选决定需要请求哪些接口
-    const requests = []
-
-    if (platformFilter.value === 'all') {
-      // 请求所有平台
-      requests.push(
-        apiClient.get('/admin/claude-accounts', { params }),
-        apiClient.get('/admin/claude-console-accounts', { params }),
-        apiClient.get('/admin/bedrock-accounts', { params }),
-        apiClient.get('/admin/gemini-accounts', { params }),
-        apiClient.get('/admin/openai-accounts', { params }),
-        apiClient.get('/admin/azure-openai-accounts', { params }),
-        apiClient.get('/admin/openai-responses-accounts', { params }),
-        apiClient.get('/admin/ccr-accounts', { params }),
-        apiClient.get('/admin/droid-accounts', { params }),
-        apiClient.get('/admin/gemini-api-accounts', { params })
-      )
-    } else {
-      // 只请求指定平台，其他平台设为null占位
-      switch (platformFilter.value) {
-        case 'claude':
-          requests.push(
-            apiClient.get('/admin/claude-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'claude-console':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            apiClient.get('/admin/claude-console-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'bedrock':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            apiClient.get('/admin/bedrock-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'gemini':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            apiClient.get('/admin/gemini-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'openai':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            apiClient.get('/admin/openai-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'azure_openai':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            apiClient.get('/admin/azure-openai-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'openai-responses':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            apiClient.get('/admin/openai-responses-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'ccr':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            apiClient.get('/admin/ccr-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'droid':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            apiClient.get('/admin/droid-accounts', { params }),
-            Promise.resolve({ success: true, data: [] }) // gemini-api 占位
-          )
-          break
-        case 'gemini-api':
-          requests.push(
-            Promise.resolve({ success: true, data: [] }), // claude 占位
-            Promise.resolve({ success: true, data: [] }), // claude-console 占位
-            Promise.resolve({ success: true, data: [] }), // bedrock 占位
-            Promise.resolve({ success: true, data: [] }), // gemini 占位
-            Promise.resolve({ success: true, data: [] }), // openai 占位
-            Promise.resolve({ success: true, data: [] }), // azure-openai 占位
-            Promise.resolve({ success: true, data: [] }), // openai-responses 占位
-            Promise.resolve({ success: true, data: [] }), // ccr 占位
-            Promise.resolve({ success: true, data: [] }), // droid 占位
-            apiClient.get('/admin/gemini-api-accounts', { params })
-          )
-          break
-        default:
-          // 默认情况下返回空数组
-          requests.push(
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] }),
-            Promise.resolve({ success: true, data: [] })
-          )
-          break
-      }
-    }
+    const platformsToFetch = getPlatformsForFilter(platformFilter.value)
 
     // 使用缓存机制加载绑定计数和分组数据（不再加载完整的 API Keys 数据）
     await Promise.all([loadBindingCounts(forceReload), loadAccountGroups(forceReload)])
@@ -2546,125 +2782,137 @@ const loadAccounts = async (forceReload = false) => {
     // 后端账户API已经包含分组信息，不需要单独加载分组成员关系
     // await loadGroupMembers(forceReload)
 
-    const [
-      claudeData,
-      claudeConsoleData,
-      bedrockData,
-      geminiData,
-      openaiData,
-      azureOpenaiData,
-      openaiResponsesData,
-      ccrData,
-      droidData,
-      geminiApiData
-    ] = await Promise.all(requests)
+    const platformResults = await Promise.all(
+      platformsToFetch.map(async (platform) => {
+        const handler = platformRequestHandlers[platform]
+        if (!handler) {
+          return { platform, success: true, data: [] }
+        }
 
-    const allAccounts = []
-
-    // 获取绑定计数数据
-    const counts = bindingCounts.value
-
-    if (claudeData.success) {
-      const claudeAccounts = (claudeData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        const boundApiKeysCount = counts.claudeAccountId?.[acc.id] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'claude', boundApiKeysCount }
-      })
-      allAccounts.push(...claudeAccounts)
-    }
-
-    if (claudeConsoleData.success) {
-      const claudeConsoleAccounts = (claudeConsoleData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        const boundApiKeysCount = counts.claudeConsoleAccountId?.[acc.id] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'claude-console', boundApiKeysCount }
-      })
-      allAccounts.push(...claudeConsoleAccounts)
-    }
-
-    if (bedrockData.success) {
-      const bedrockAccounts = (bedrockData.data || []).map((acc) => {
-        // Bedrock账户暂时不支持直接绑定
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'bedrock', boundApiKeysCount: 0 }
-      })
-      allAccounts.push(...bedrockAccounts)
-    }
-
-    if (geminiData.success) {
-      const geminiAccounts = (geminiData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        const boundApiKeysCount = counts.geminiAccountId?.[acc.id] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'gemini', boundApiKeysCount }
-      })
-      allAccounts.push(...geminiAccounts)
-    }
-    if (openaiData.success) {
-      const openaiAccounts = (openaiData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        const boundApiKeysCount = counts.openaiAccountId?.[acc.id] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'openai', boundApiKeysCount }
-      })
-      allAccounts.push(...openaiAccounts)
-    }
-    if (azureOpenaiData && azureOpenaiData.success) {
-      const azureOpenaiAccounts = (azureOpenaiData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        const boundApiKeysCount = counts.azureOpenaiAccountId?.[acc.id] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'azure_openai', boundApiKeysCount }
-      })
-      allAccounts.push(...azureOpenaiAccounts)
-    }
-
-    if (openaiResponsesData && openaiResponsesData.success) {
-      const openaiResponsesAccounts = (openaiResponsesData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        // OpenAI-Responses账户使用 responses: 前缀
-        const boundApiKeysCount = counts.openaiAccountId?.[`responses:${acc.id}`] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'openai-responses', boundApiKeysCount }
-      })
-      allAccounts.push(...openaiResponsesAccounts)
-    }
-
-    // CCR 账户
-    if (ccrData && ccrData.success) {
-      const ccrAccounts = (ccrData.data || []).map((acc) => {
-        // CCR 不支持 API Key 绑定，固定为 0
-        return { ...acc, platform: 'ccr', boundApiKeysCount: 0 }
-      })
-      allAccounts.push(...ccrAccounts)
-    }
-
-    // Droid 账户
-    if (droidData && droidData.success) {
-      const droidAccounts = (droidData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        const boundApiKeysCount = counts.droidAccountId?.[acc.id] || acc.boundApiKeysCount || 0
-        return {
-          ...acc,
-          platform: 'droid',
-          boundApiKeysCount
+        try {
+          const res = await handler(params)
+          return { platform, success: res?.success, data: res?.data }
+        } catch (error) {
+          console.debug(`Failed to load ${platform} accounts:`, error)
+          return { platform, success: false, data: [] }
         }
       })
-      allAccounts.push(...droidAccounts)
+    )
+
+    const allAccounts = []
+    const counts = bindingCounts.value || {}
+    let openaiResponsesRaw = []
+
+    const appendAccounts = (platform, data) => {
+      if (!data || data.length === 0) return
+
+      switch (platform) {
+        case 'claude': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.claudeAccountId?.[acc.id] || 0
+            return { ...acc, platform: 'claude', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        case 'claude-console': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.claudeConsoleAccountId?.[acc.id] || 0
+            return { ...acc, platform: 'claude-console', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        case 'bedrock': {
+          const items = data.map((acc) => ({ ...acc, platform: 'bedrock', boundApiKeysCount: 0 }))
+          allAccounts.push(...items)
+          break
+        }
+        case 'gemini': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.geminiAccountId?.[acc.id] || 0
+            return { ...acc, platform: 'gemini', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        case 'openai': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.openaiAccountId?.[acc.id] || 0
+            return { ...acc, platform: 'openai', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        case 'azure_openai': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.azureOpenaiAccountId?.[acc.id] || 0
+            return { ...acc, platform: 'azure_openai', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        case 'openai-responses': {
+          openaiResponsesRaw = data
+          break
+        }
+        case 'ccr': {
+          const items = data.map((acc) => ({ ...acc, platform: 'ccr', boundApiKeysCount: 0 }))
+          allAccounts.push(...items)
+          break
+        }
+        case 'droid': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.droidAccountId?.[acc.id] || acc.boundApiKeysCount || 0
+            return { ...acc, platform: 'droid', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        case 'gemini-api': {
+          const items = data.map((acc) => {
+            const boundApiKeysCount = counts.geminiAccountId?.[`api:${acc.id}`] || 0
+            return { ...acc, platform: 'gemini-api', boundApiKeysCount }
+          })
+          allAccounts.push(...items)
+          break
+        }
+        default:
+          break
+      }
     }
 
-    // Gemini API 账户
-    if (geminiApiData && geminiApiData.success) {
-      const geminiApiAccounts = (geminiApiData.data || []).map((acc) => {
-        // 从绑定计数缓存获取数量
-        // Gemini-API账户使用 api: 前缀
-        const boundApiKeysCount = counts.geminiAccountId?.[`api:${acc.id}`] || 0
-        // 后端已经包含了groupInfos，直接使用
-        return { ...acc, platform: 'gemini-api', boundApiKeysCount }
+    platformResults.forEach(({ platform, success, data }) => {
+      if (success) {
+        appendAccounts(platform, data || [])
+      }
+    })
+
+    if (openaiResponsesRaw.length > 0) {
+      let autoRecoveryConfigMap = {}
+      try {
+        const configsRes = await apiClient.get(
+          '/admin/openai-responses-accounts/auto-recovery-configs'
+        )
+        if (configsRes.success && Array.isArray(configsRes.data)) {
+          autoRecoveryConfigMap = configsRes.data.reduce((map, config) => {
+            if (config?.accountId) {
+              map[config.accountId] = config
+            }
+            return map
+          }, {})
+        }
+      } catch (error) {
+        console.debug('Failed to load auto-recovery configs:', error)
+      }
+
+      const responsesAccounts = openaiResponsesRaw.map((acc) => {
+        const boundApiKeysCount = counts.openaiAccountId?.[`responses:${acc.id}`] || 0
+        const autoRecoveryConfig = autoRecoveryConfigMap[acc.id] || acc.autoRecoveryConfig || null
+        return { ...acc, platform: 'openai-responses', boundApiKeysCount, autoRecoveryConfig }
       })
-      allAccounts.push(...geminiApiAccounts)
+
+      allAccounts.push(...responsesAccounts)
     }
 
     // 根据分组筛选器过滤账户
@@ -3014,6 +3262,58 @@ const formatRateLimitTime = (minutes) => {
   }
 }
 
+// 检查账户是否被限流
+const isAccountRateLimited = (account) => {
+  if (!account) return false
+
+  // 检查 rateLimitStatus
+  if (account.rateLimitStatus) {
+    if (typeof account.rateLimitStatus === 'string' && account.rateLimitStatus === 'limited') {
+      return true
+    }
+    if (
+      typeof account.rateLimitStatus === 'object' &&
+      account.rateLimitStatus.isRateLimited === true
+    ) {
+      return true
+    }
+  }
+
+  return false
+}
+
+// 获取限流剩余时间（分钟）
+const getRateLimitRemainingMinutes = (account) => {
+  if (!account || !account.rateLimitStatus) return 0
+
+  if (typeof account.rateLimitStatus === 'object') {
+    const status = account.rateLimitStatus
+    if (Number.isFinite(status.minutesRemaining)) {
+      return Math.max(0, Math.ceil(status.minutesRemaining))
+    }
+    if (Number.isFinite(status.remainingMinutes)) {
+      return Math.max(0, Math.ceil(status.remainingMinutes))
+    }
+    if (Number.isFinite(status.remainingSeconds)) {
+      return Math.max(0, Math.ceil(status.remainingSeconds / 60))
+    }
+    if (status.rateLimitResetAt) {
+      const diffMs = new Date(status.rateLimitResetAt).getTime() - Date.now()
+      return diffMs > 0 ? Math.ceil(diffMs / 60000) : 0
+    }
+  }
+
+  // 如果有 rateLimitUntil 字段，计算剩余时间
+  if (account.rateLimitUntil) {
+    const now = new Date().getTime()
+    const untilTime = new Date(account.rateLimitUntil).getTime()
+    const diff = untilTime - now
+    return diff > 0 ? Math.ceil(diff / 60000) : 0
+  }
+
+  return 0
+}
+
 // 打开创建账户模态框
 const openCreateAccountModal = () => {
   newAccountPlatform.value = null // 重置选择的平台
diff --git a/web/admin-spa/src/views/ApiKeyUsageRecordsView.vue b/web/admin-spa/src/views/ApiKeyUsageRecordsView.vue
new file mode 100644
index 00000000..dcdeba48
--- /dev/null
+++ b/web/admin-spa/src/views/ApiKeyUsageRecordsView.vue
@@ -0,0 +1,549 @@
+<template>
+  <div class="space-y-4 p-4 lg:p-6">
+    <div class="flex flex-wrap items-center justify-between gap-3">
+      <div class="flex items-center gap-3">
+        <button
+          class="rounded-full border border-gray-200 px-3 py-2 text-sm text-gray-700 transition hover:bg-gray-100 dark:border-gray-700 dark:text-gray-200 dark:hover:bg-gray-800"
+          @click="goBack"
+        >
+          ← 返回
+        </button>
+        <div>
+          <p class="text-xs font-semibold uppercase tracking-wide text-blue-600 dark:text-blue-400">
+            API Key 请求详情时间线
+          </p>
+          <h2 class="text-xl font-bold text-gray-900 dark:text-gray-100">
+            {{ apiKeyDisplayName }}
+          </h2>
+          <p class="text-xs text-gray-500 dark:text-gray-400">ID: {{ keyId }}</p>
+        </div>
+      </div>
+      <div class="flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400">
+        <i class="fas fa-clock text-blue-500" />
+        <span v-if="dateRangeHint">{{ dateRangeHint }}</span>
+        <span v-else>显示近 5000 条记录</span>
+      </div>
+    </div>
+
+    <div class="grid gap-3 md:grid-cols-2 xl:grid-cols-4">
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">总请求</p>
+        <p class="mt-1 text-2xl font-bold text-gray-900 dark:text-gray-100">
+          {{ formatNumber(summary.totalRequests) }}
+        </p>
+      </div>
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">总 Token</p>
+        <p class="mt-1 text-2xl font-bold text-gray-900 dark:text-gray-100">
+          {{ formatNumber(summary.totalTokens) }}
+        </p>
+      </div>
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">总费用</p>
+        <p class="mt-1 text-2xl font-bold text-yellow-600 dark:text-yellow-400">
+          {{ formatCost(summary.totalCost) }}
+        </p>
+      </div>
+      <div
+        class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+      >
+        <p class="text-xs uppercase text-gray-500 dark:text-gray-400">平均费用/次</p>
+        <p class="mt-1 text-2xl font-bold text-gray-900 dark:text-gray-100">
+          {{ formatCost(summary.avgCost) }}
+        </p>
+      </div>
+    </div>
+
+    <div
+      class="rounded-xl border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+    >
+      <div class="flex flex-wrap items-center gap-3">
+        <el-date-picker
+          v-model="filters.dateRange"
+          class="max-w-[320px]"
+          clearable
+          end-placeholder="结束时间"
+          format="YYYY-MM-DD HH:mm:ss"
+          start-placeholder="开始时间"
+          type="datetimerange"
+          unlink-panels
+          value-format="YYYY-MM-DDTHH:mm:ss[Z]"
+        />
+
+        <el-select
+          v-model="filters.model"
+          class="w-[180px]"
+          clearable
+          filterable
+          placeholder="所有模型"
+        >
+          <el-option
+            v-for="modelOption in availableModels"
+            :key="modelOption"
+            :label="modelOption"
+            :value="modelOption"
+          />
+        </el-select>
+
+        <el-select
+          v-model="filters.accountId"
+          class="w-[220px]"
+          clearable
+          filterable
+          placeholder="所有账户"
+        >
+          <el-option
+            v-for="account in availableAccounts"
+            :key="account.id"
+            :label="`${account.name}（${account.accountTypeName}）`"
+            :value="account.id"
+          />
+        </el-select>
+
+        <el-select v-model="filters.sortOrder" class="w-[140px]" placeholder="排序">
+          <el-option label="时间降序" value="desc" />
+          <el-option label="时间升序" value="asc" />
+        </el-select>
+
+        <el-button @click="resetFilters"> <i class="fas fa-undo mr-2" /> 重置 </el-button>
+        <el-button :loading="exporting" type="primary" @click="exportCsv">
+          <i class="fas fa-file-export mr-2" /> 导出 CSV
+        </el-button>
+      </div>
+    </div>
+
+    <div
+      class="rounded-xl border border-gray-200 bg-white shadow-sm dark:border-gray-800 dark:bg-gray-900"
+    >
+      <div
+        v-if="loading"
+        class="flex items-center justify-center p-10 text-gray-500 dark:text-gray-400"
+      >
+        <i class="fas fa-spinner fa-spin mr-2" /> 加载中...
+      </div>
+      <div v-else>
+        <div
+          v-if="records.length === 0"
+          class="flex flex-col items-center gap-2 p-10 text-gray-500 dark:text-gray-400"
+        >
+          <i class="fas fa-inbox text-2xl" />
+          <p>暂无记录</p>
+        </div>
+        <div v-else class="space-y-4">
+          <div class="hidden overflow-x-auto md:block">
+            <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-800">
+              <thead class="bg-gray-50 dark:bg-gray-800">
+                <tr>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    时间
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    账户
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    模型
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    输入
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    输出
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    缓存(创/读)
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    总 Token
+                  </th>
+                  <th
+                    class="px-4 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    费用
+                  </th>
+                  <th
+                    class="px-4 py-3 text-right text-xs font-medium uppercase tracking-wider text-gray-500 dark:text-gray-300"
+                  >
+                    操作
+                  </th>
+                </tr>
+              </thead>
+              <tbody
+                class="divide-y divide-gray-200 bg-white dark:divide-gray-800 dark:bg-gray-900"
+              >
+                <tr v-for="record in records" :key="record.timestamp + record.model">
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    {{ formatDate(record.timestamp) }}
+                  </td>
+                  <td class="px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    <div class="flex flex-col">
+                      <span class="font-semibold">{{ record.accountName || '未知账户' }}</span>
+                      <span class="text-xs text-gray-500 dark:text-gray-400">
+                        {{ record.accountTypeName || '未知渠道' }}
+                      </span>
+                    </div>
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    {{ record.model }}
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-blue-600 dark:text-blue-400">
+                    {{ formatNumber(record.inputTokens) }}
+                  </td>
+                  <td
+                    class="whitespace-nowrap px-4 py-3 text-sm text-green-600 dark:text-green-400"
+                  >
+                    {{ formatNumber(record.outputTokens) }}
+                  </td>
+                  <td
+                    class="whitespace-nowrap px-4 py-3 text-sm text-purple-600 dark:text-purple-400"
+                  >
+                    {{ formatNumber(record.cacheCreateTokens) }} /
+                    {{ formatNumber(record.cacheReadTokens) }}
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-sm text-gray-800 dark:text-gray-100">
+                    {{ formatNumber(record.totalTokens) }}
+                  </td>
+                  <td
+                    class="whitespace-nowrap px-4 py-3 text-sm text-yellow-600 dark:text-yellow-400"
+                  >
+                    {{ record.costFormatted || formatCost(record.cost) }}
+                  </td>
+                  <td class="whitespace-nowrap px-4 py-3 text-right text-sm">
+                    <el-button size="small" @click="openDetail(record)">详情</el-button>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <div class="space-y-3 md:hidden">
+            <div
+              v-for="record in records"
+              :key="record.timestamp + record.model"
+              class="rounded-lg border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-800 dark:bg-gray-900"
+            >
+              <div class="flex items-center justify-between">
+                <div>
+                  <p class="text-sm font-semibold text-gray-900 dark:text-gray-100">
+                    {{ record.accountName || '未知账户' }}
+                  </p>
+                  <p class="text-xs text-gray-500 dark:text-gray-400">
+                    {{ formatDate(record.timestamp) }}
+                  </p>
+                </div>
+                <el-button size="small" @click="openDetail(record)">详情</el-button>
+              </div>
+              <div class="mt-3 grid grid-cols-2 gap-2 text-sm text-gray-700 dark:text-gray-300">
+                <div>模型：{{ record.model }}</div>
+                <div>总 Token：{{ formatNumber(record.totalTokens) }}</div>
+                <div>输入：{{ formatNumber(record.inputTokens) }}</div>
+                <div>输出：{{ formatNumber(record.outputTokens) }}</div>
+                <div>
+                  缓存创/读：{{ formatNumber(record.cacheCreateTokens) }} /
+                  {{ formatNumber(record.cacheReadTokens) }}
+                </div>
+                <div class="text-yellow-600 dark:text-yellow-400">
+                  费用：{{ record.costFormatted || formatCost(record.cost) }}
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div class="flex items-center justify-between px-4 pb-4">
+            <div class="text-sm text-gray-500 dark:text-gray-400">
+              共 {{ pagination.totalRecords }} 条记录
+            </div>
+            <el-pagination
+              background
+              :current-page="pagination.currentPage"
+              layout="prev, pager, next, sizes"
+              :page-size="pagination.pageSize"
+              :page-sizes="[20, 50, 100, 200]"
+              :total="pagination.totalRecords"
+              @current-change="handlePageChange"
+              @size-change="handleSizeChange"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <RecordDetailModal :record="activeRecord" :show="detailVisible" @close="closeDetail" />
+  </div>
+</template>
+
+<script setup>
+import { computed, onMounted, reactive, ref, watch } from 'vue'
+import dayjs from 'dayjs'
+import { useRoute, useRouter } from 'vue-router'
+import { apiClient } from '@/config/api'
+import { showToast } from '@/utils/toast'
+import { formatNumber } from '@/utils/format'
+import RecordDetailModal from '@/components/apikeys/RecordDetailModal.vue'
+
+const route = useRoute()
+const router = useRouter()
+
+const keyId = computed(() => route.params.keyId)
+const loading = ref(false)
+const exporting = ref(false)
+const records = ref([])
+const availableModels = ref([])
+const availableAccounts = ref([])
+
+const pagination = reactive({
+  currentPage: 1,
+  pageSize: 50,
+  totalRecords: 0
+})
+
+const filters = reactive({
+  dateRange: null,
+  model: '',
+  accountId: '',
+  sortOrder: 'desc'
+})
+
+const summary = reactive({
+  totalRequests: 0,
+  totalTokens: 0,
+  totalCost: 0,
+  avgCost: 0
+})
+
+const apiKeyInfo = reactive({
+  id: keyId.value,
+  name: ''
+})
+
+const detailVisible = ref(false)
+const activeRecord = ref(null)
+
+const apiKeyDisplayName = computed(() => apiKeyInfo.name || apiKeyInfo.id || keyId.value)
+
+const dateRangeHint = computed(() => {
+  if (!filters.dateRange || filters.dateRange.length !== 2) return ''
+  return `${formatDate(filters.dateRange[0])} ~ ${formatDate(filters.dateRange[1])}`
+})
+
+const formatDate = (value) => {
+  if (!value) return '--'
+  return dayjs(value).format('YYYY-MM-DD HH:mm:ss')
+}
+
+const formatCost = (value) => {
+  const num = typeof value === 'number' ? value : 0
+  if (num >= 1) return `$${num.toFixed(2)}`
+  if (num >= 0.001) return `$${num.toFixed(4)}`
+  return `$${num.toFixed(6)}`
+}
+
+const buildParams = (page) => {
+  const params = {
+    page,
+    pageSize: pagination.pageSize,
+    sortOrder: filters.sortOrder
+  }
+
+  if (filters.model) params.model = filters.model
+  if (filters.accountId) params.accountId = filters.accountId
+  if (filters.dateRange && filters.dateRange.length === 2) {
+    params.startDate = dayjs(filters.dateRange[0]).toISOString()
+    params.endDate = dayjs(filters.dateRange[1]).toISOString()
+  }
+
+  return params
+}
+
+const syncResponseState = (data) => {
+  records.value = data.records || []
+
+  const pageInfo = data.pagination || {}
+  pagination.currentPage = pageInfo.currentPage || 1
+  pagination.pageSize = pageInfo.pageSize || pagination.pageSize
+  pagination.totalRecords = pageInfo.totalRecords || 0
+
+  const filterEcho = data.filters || {}
+  if (filterEcho.model !== undefined) filters.model = filterEcho.model || ''
+  if (filterEcho.accountId !== undefined) filters.accountId = filterEcho.accountId || ''
+  if (filterEcho.sortOrder) filters.sortOrder = filterEcho.sortOrder
+  if (filterEcho.startDate && filterEcho.endDate) {
+    const nextRange = [filterEcho.startDate, filterEcho.endDate]
+    const currentRange = filters.dateRange || []
+    if (currentRange[0] !== nextRange[0] || currentRange[1] !== nextRange[1]) {
+      filters.dateRange = nextRange
+    }
+  }
+
+  const summaryData = data.summary || {}
+  summary.totalRequests = summaryData.totalRequests || 0
+  summary.totalTokens = summaryData.totalTokens || 0
+  summary.totalCost = summaryData.totalCost || 0
+  summary.avgCost = summaryData.avgCost || 0
+
+  apiKeyInfo.id = data.apiKeyInfo?.id || keyId.value
+  apiKeyInfo.name = data.apiKeyInfo?.name || ''
+
+  availableModels.value = data.availableFilters?.models || []
+  availableAccounts.value = data.availableFilters?.accounts || []
+}
+
+const fetchRecords = async (page = pagination.currentPage) => {
+  loading.value = true
+  try {
+    const response = await apiClient.get(`/admin/api-keys/${keyId.value}/usage-records`, {
+      params: buildParams(page)
+    })
+    syncResponseState(response.data || {})
+  } catch (error) {
+    showToast(`加载请求记录失败：${error.message || '未知错误'}`, 'error')
+  } finally {
+    loading.value = false
+  }
+}
+
+const handlePageChange = (page) => {
+  pagination.currentPage = page
+  fetchRecords(page)
+}
+
+const handleSizeChange = (size) => {
+  pagination.pageSize = size
+  pagination.currentPage = 1
+  fetchRecords(1)
+}
+
+const resetFilters = () => {
+  filters.model = ''
+  filters.accountId = ''
+  filters.dateRange = null
+  filters.sortOrder = 'desc'
+  pagination.currentPage = 1
+  fetchRecords(1)
+}
+
+const openDetail = (record) => {
+  activeRecord.value = record
+  detailVisible.value = true
+}
+
+const closeDetail = () => {
+  detailVisible.value = false
+  activeRecord.value = null
+}
+
+const goBack = () => {
+  router.push('/api-keys')
+}
+
+const exportCsv = async () => {
+  if (exporting.value) return
+  exporting.value = true
+  try {
+    const aggregated = []
+    let page = 1
+    let totalPages = 1
+    const maxPages = 50 // 50 * 200 = 10000，超过后端 5000 上限已足够
+
+    while (page <= totalPages && page <= maxPages) {
+      const response = await apiClient.get(`/admin/api-keys/${keyId.value}/usage-records`, {
+        params: { ...buildParams(page), pageSize: 200 }
+      })
+      const payload = response.data || {}
+      aggregated.push(...(payload.records || []))
+      totalPages = payload.pagination?.totalPages || 1
+      page += 1
+    }
+
+    if (aggregated.length === 0) {
+      showToast('没有可导出的记录', 'info')
+      return
+    }
+
+    const headers = [
+      '时间',
+      '账户',
+      '渠道',
+      '模型',
+      '输入Token',
+      '输出Token',
+      '缓存创建Token',
+      '缓存读取Token',
+      '总Token',
+      '费用'
+    ]
+
+    const csvRows = [headers.join(',')]
+    aggregated.forEach((record) => {
+      const row = [
+        formatDate(record.timestamp),
+        record.accountName || '',
+        record.accountTypeName || '',
+        record.model || '',
+        record.inputTokens || 0,
+        record.outputTokens || 0,
+        record.cacheCreateTokens || 0,
+        record.cacheReadTokens || 0,
+        record.totalTokens || 0,
+        record.costFormatted || formatCost(record.cost)
+      ]
+      csvRows.push(row.map((cell) => `"${String(cell).replace(/"/g, '""')}"`).join(','))
+    })
+
+    const blob = new Blob([csvRows.join('\n')], {
+      type: 'text/csv;charset=utf-8;'
+    })
+    const url = URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = `api-key-${keyId.value}-usage-records.csv`
+    link.click()
+    URL.revokeObjectURL(url)
+    showToast('导出 CSV 成功', 'success')
+  } catch (error) {
+    showToast(`导出失败：${error.message || '未知错误'}`, 'error')
+  } finally {
+    exporting.value = false
+  }
+}
+
+watch(
+  () => [filters.model, filters.accountId, filters.sortOrder],
+  () => {
+    pagination.currentPage = 1
+    fetchRecords(1)
+  }
+)
+
+watch(
+  () => filters.dateRange,
+  () => {
+    pagination.currentPage = 1
+    fetchRecords(1)
+  },
+  { deep: true }
+)
+
+onMounted(() => {
+  fetchRecords()
+})
+</script>
diff --git a/web/admin-spa/src/views/ApiKeysView.vue b/web/admin-spa/src/views/ApiKeysView.vue
index 507fd392..52a4cf56 100644
--- a/web/admin-spa/src/views/ApiKeysView.vue
+++ b/web/admin-spa/src/views/ApiKeysView.vue
@@ -116,6 +116,29 @@
                 </div>
               </div>
 
+              <!-- 模型筛选器 -->
+              <div class="group relative min-w-[140px]">
+                <div
+                  class="absolute -inset-0.5 rounded-lg bg-gradient-to-r from-orange-500 to-amber-500 opacity-0 blur transition duration-300 group-hover:opacity-20"
+                ></div>
+                <div class="relative">
+                  <CustomDropdown
+                    v-model="selectedModels"
+                    icon="fa-cube"
+                    icon-color="text-orange-500"
+                    :multiple="true"
+                    :options="modelOptions"
+                    placeholder="所有模型"
+                  />
+                  <span
+                    v-if="selectedModels.length > 0"
+                    class="absolute -right-2 -top-2 z-10 flex h-5 w-5 items-center justify-center rounded-full bg-orange-500 text-xs text-white shadow-sm"
+                  >
+                    {{ selectedModels.length }}
+                  </span>
+                </div>
+              </div>
+
               <!-- 搜索模式与搜索框 -->
               <div class="flex min-w-[240px] flex-col gap-2 sm:flex-row sm:items-center">
                 <div class="sm:w-44">
@@ -2085,17 +2108,18 @@
       @save="handleSaveExpiry"
     />
 
-    <!-- 使用详情弹窗 -->
     <UsageDetailModal
       :api-key="selectedApiKeyForDetail || {}"
       :show="showUsageDetailModal"
       @close="showUsageDetailModal = false"
+      @open-timeline="openTimeline"
     />
   </div>
 </template>
 
 <script setup>
 import { ref, reactive, computed, onMounted, onUnmounted, watch } from 'vue'
+import { useRouter } from 'vue-router'
 import { showToast } from '@/utils/toast'
 import { apiClient } from '@/config/api'
 import { useClientsStore } from '@/stores/clients'
@@ -2114,6 +2138,7 @@ import CustomDropdown from '@/components/common/CustomDropdown.vue'
 import ActionDropdown from '@/components/common/ActionDropdown.vue'
 
 // 响应式数据
+const router = useRouter()
 const clientsStore = useClientsStore()
 const authStore = useAuthStore()
 const apiKeys = ref([])
@@ -2218,6 +2243,10 @@ const selectedApiKeyForDetail = ref(null)
 const selectedTagFilter = ref('')
 const availableTags = ref([])
 
+// 模型筛选相关
+const selectedModels = ref([])
+const availableModels = ref([])
+
 // 搜索相关
 const searchKeyword = ref('')
 const searchMode = ref('apiKey')
@@ -2234,6 +2263,14 @@ const tagOptions = computed(() => {
   return options
 })
 
+const modelOptions = computed(() => {
+  return availableModels.value.map((model) => ({
+    value: model,
+    label: model,
+    icon: 'fa-cube'
+  }))
+})
+
 const selectedTagCount = computed(() => {
   if (!selectedTagFilter.value) return 0
   return apiKeys.value.filter((key) => key.tags && key.tags.includes(selectedTagFilter.value))
@@ -2472,6 +2509,18 @@ const loadAccounts = async (forceRefresh = false) => {
   }
 }
 
+// 加载已使用的模型列表
+const loadUsedModels = async () => {
+  try {
+    const data = await apiClient.get('/admin/api-keys/used-models')
+    if (data.success) {
+      availableModels.value = data.data || []
+    }
+  } catch (error) {
+    console.error('Failed to load used models:', error)
+  }
+}
+
 // 加载API Keys（使用后端分页）
 const loadApiKeys = async (clearStatsCache = true) => {
   apiKeysLoading.value = true
@@ -2500,6 +2549,11 @@ const loadApiKeys = async (clearStatsCache = true) => {
       params.set('tag', selectedTagFilter.value)
     }
 
+    // 模型筛选参数
+    if (selectedModels.value.length > 0) {
+      params.set('models', selectedModels.value.join(','))
+    }
+
     // 排序参数（支持费用排序）
     const validSortFields = [
       'name',
@@ -4193,19 +4247,15 @@ const formatWindowTime = (seconds) => {
 
 // 显示使用详情
 const showUsageDetails = (apiKey) => {
-  // 获取异步加载的统计数据
   const cachedStats = getCachedStats(apiKey.id)
 
-  // 合并异步统计数据到 apiKey 对象
   const enrichedApiKey = {
     ...apiKey,
-    // 合并实时限制数据
     dailyCost: cachedStats?.dailyCost ?? apiKey.dailyCost ?? 0,
     currentWindowCost: cachedStats?.currentWindowCost ?? apiKey.currentWindowCost ?? 0,
     windowRemainingSeconds: cachedStats?.windowRemainingSeconds ?? apiKey.windowRemainingSeconds,
     windowStartTime: cachedStats?.windowStartTime ?? apiKey.windowStartTime ?? null,
     windowEndTime: cachedStats?.windowEndTime ?? apiKey.windowEndTime ?? null,
-    // 合并 usage 数据（用于详情弹窗中的统计卡片）
     usage: {
       ...apiKey.usage,
       total: {
@@ -4226,6 +4276,13 @@ const showUsageDetails = (apiKey) => {
   showUsageDetailModal.value = true
 }
 
+const openTimeline = (keyId) => {
+  const id = keyId || selectedApiKeyForDetail.value?.id
+  if (!id) return
+  showUsageDetailModal.value = false
+  router.push(`/api-keys/${id}/usage-records`)
+}
+
 // 格式化时间（秒转换为可读格式） - 已移到 WindowLimitBar 组件中
 // const formatTime = (seconds) => {
 //   if (seconds === null || seconds === undefined) return '--:--'
@@ -4706,6 +4763,12 @@ watch(selectedTagFilter, () => {
   loadApiKeys(false)
 })
 
+// 监听模型筛选变化
+watch(selectedModels, () => {
+  currentPage.value = 1
+  loadApiKeys(false)
+})
+
 // 监听排序变化，重新加载数据
 watch([apiKeysSortBy, apiKeysSortOrder], () => {
   loadApiKeys(false)
@@ -4740,7 +4803,7 @@ onMounted(async () => {
   fetchCostSortStatus()
 
   // 先加载 API Keys（优先显示列表）
-  await Promise.all([clientsStore.loadSupportedClients(), loadApiKeys()])
+  await Promise.all([clientsStore.loadSupportedClients(), loadApiKeys(), loadUsedModels()])
 
   // 初始化全选状态
   updateSelectAllState()
diff --git a/web/admin-spa/src/views/DashboardView.vue b/web/admin-spa/src/views/DashboardView.vue
index 61ac8124..84d60d27 100644
--- a/web/admin-spa/src/views/DashboardView.vue
+++ b/web/admin-spa/src/views/DashboardView.vue
@@ -1036,6 +1036,7 @@ function createUsageTrendChart() {
           type: 'linear',
           display: true,
           position: 'left',
+          min: 0,
           title: {
             display: true,
             text: 'Token数量',
@@ -1055,6 +1056,7 @@ function createUsageTrendChart() {
           type: 'linear',
           display: true,
           position: 'right',
+          min: 0,
           title: {
             display: true,
             text: '请求数',
@@ -1073,7 +1075,8 @@ function createUsageTrendChart() {
         y2: {
           type: 'linear',
           display: false, // 隐藏费用轴，在tooltip中显示
-          position: 'right'
+          position: 'right',
+          min: 0
         }
       }
     }
@@ -1253,6 +1256,7 @@ function createApiKeysUsageTrendChart() {
         },
         y: {
           beginAtZero: true,
+          min: 0,
           title: {
             display: true,
             text: apiKeysTrendMetric.value === 'tokens' ? 'Token 数量' : '请求次数',
@@ -1428,6 +1432,7 @@ function createAccountUsageTrendChart() {
         },
         y: {
           beginAtZero: true,
+          min: 0,
           title: {
             display: true,
             text: '消耗金额 (USD)',