dsh-modelscope-pool 0.10.2 → 0.11.0

package/README.md

@@ -121,7 +121,7 @@
 ### 方式一：从 npm 安装（推荐）
 
 ```bash
-dsh plugin --profile web add dsh-modelscope-pool@0.10.0
+dsh plugin --profile web add dsh-modelscope-pool@0.11.0
 ```
 
 一条命令搞定。装好后重启 App（或让插件重新加载），网关会在 `127.0.0.1:8899` 起来。
@@ -199,7 +199,7 @@ dsh plugin --profile web add /path/to/dsh-modelscope-pool
 
 ## 界面
 
-插件在 dsh-go 的对话界面加了入口（输入框上方两个按钮 + 一条常驻状态条），另外注册了三个原生面板：
+插件在 dsh-go 的输入框上方放了一条常驻状态条，点它直接进「魔搭 Key 池」面板；另外注册了三个原生面板：
 
 | 面板 | 位置 | 内容 |
 |---|---|---|
@@ -207,7 +207,9 @@ dsh plugin --profile web add /path/to/dsh-modelscope-pool
 | **Key 详情** | 侧栏 / 功能页 | 点列表任意一行进来：完整令牌、站点、额度明细、状态、失败原因，以及禁用 / 停用 / 恢复 / 删除（删除需连点两次确认） |
 | **魔搭模型** | 对话标签 / 侧栏 / 功能页 | 按「国际版 / 国内版 / 双站」分组的模型列表，点一下设为默认，底部可重新拉取 |
 
-输入框上方还有一条常驻状态条，显示池里可用 Key 的数量。
+输入框上方那条状态条显示「魔搭 93/95 · 2340 魔粒」，点一下就进面板——添加 Key、刷新额度都在面板里完成。
+
+> 0.11.0 去掉了原先输入框上方的两个悬浮按钮：插件侧控制不了 App 给悬浮按钮加的投影，看起来像「胶囊按钮带阴影」。入口合并到状态条，一次点按到位，也不再有两层悬浮元素叠在一起。
 
 ---
 
@@ -334,7 +336,13 @@ dsh-go 里更进一步：这个插件会把自己注册成一个叫 **魔搭 Key
 看看是不是被「手动禁用」了（`manual` 标记）。手动禁用不会被自动恢复流程放开，需要点「恢复」。
 
 **点「刷新额度」提示「魔搭 Key 池没有响应」？**
-App 要求点按在 3 秒内返回，而刷新额度要联网逐个查所有 Key 的额度，早就超过 3 秒了。0.10.2 起这几个慢操作（刷新额度 / 测试全部 / 重新拉取模型 / 添加 Key）不再在点按里等：点一下立刻在**面板顶部**显示「正在刷新额度」，**3 秒后自动收起**（操作不会中断），跑完再把结果挂上去 3 秒。如果你还在 0.10.0 或更早，升级即可。
+App 要求点按在 3 秒内返回，而刷新额度要联网逐个查所有 Key 的额度，早就超过 3 秒了。0.10.3 起这几个慢操作（刷新额度 / 测试全部 / 重新拉取模型 / 添加 Key）不再在点按里等：点一下立刻在**面板顶部**显示「正在刷新额度」，**3 秒后自动收起**（操作不会中断），跑完再把结果挂上去 3 秒。如果你还在 0.10.0 或更早，升级即可。
+
+**一次粘贴很多个 Key，只加进去一部分？**
+每行一个，或者用逗号、空格、分号分隔都行，重复的会自动跳过。0.11.0 起入库是本地写文件、立刻返回，认站点和查额度放到后台，粘 50 个也不会卡住，也不会挡住下一批。
+
+**为什么模型列表里没有国内版模型？**
+面板和模型页只显示「池里真有这个站点 Key」的模型。只有国际版 Key 时，国内版独占的模型不会出现；等加进国内版 Key 并查过额度后，它们会自动出现。
 
 **端口被占用？**
 改 `config.json` 的 `port`，同时把客户端和供应商配置里的地址一起改掉。

package/lib/index.js

@@ -144,6 +144,48 @@ export function apply(ctx) {
   })
   let refreshPanel = () => {}
   let refreshStrip = () => {}
+
+  // 慢操作的顶部提示：写进 data.hint，3 秒后自动收起（后台任务不中断）。
+  // 必须放在这一层：buildData 在外面读它，放进 inject 回调里会变成未定义变量。
+  let notice = ''
+  let noticeUntil = 0
+  const noticeNow = () => (noticeUntil > Date.now() ? notice : '')
+  let noticeTimer = null
+  const kicks = new Set()
+  const setNotice = (text, ms = 3000) => {
+    notice = String(text ?? '')
+    noticeUntil = notice ? Date.now() + ms : 0
+    try {
+      refreshPanel()
+    } catch {}
+    try {
+      refreshStrip()
+    } catch {}
+    // 立刻推一次：点下就能看到，不用等下一次心跳。
+    for (const kick of kicks) {
+      try {
+        kick()
+      } catch {}
+    }
+    // 到点主动推一次，让提示正好在 3 秒收起，而不是等下一次 1.5 秒心跳。
+    if (noticeTimer) clearTimeout(noticeTimer)
+    noticeTimer = null
+    if (noticeUntil > 0) {
+      noticeTimer = setTimeout(() => {
+        noticeTimer = null
+        if (noticeUntil > Date.now()) return
+        try {
+          refreshPanel()
+        } catch {}
+        for (const kick of kicks) {
+          try {
+            kick()
+          } catch {}
+        }
+      }, ms + 60)
+      if (typeof noticeTimer.unref === 'function') noticeTimer.unref()
+    }
+  }
   // Key 级无感路由：模型不变，只换 Key。
   const router = createRouter({ logger })
 
@@ -288,6 +330,22 @@ const modelRowOf = (entry, current, t) => {
     }
   }
 
+  /**
+   * 面板和模型页里该显示哪些模型：只显示「池里真的有这个站点的 Key」的那些。
+   * 只有国际版 Key 时就不该冒出国内版模型，反之亦然。
+   * 站点一个都还没认出来时（刚导入、还没查过额度）先全部显示。
+   */
+  function visibleModels() {
+    const entries = (catalog?.entries ?? []).filter((entry) => isChatModel(entry.id))
+    const live = new Set((pool?.keys ?? []).map((k) => k.region).filter((r) => r === 'ai' || r === 'cn'))
+    if (live.size === 0) return entries
+    return entries.filter((entry) => {
+      const regions = entry.regions ?? []
+      if (regions.length === 0) return true
+      return regions.some((region) => live.has(region))
+    })
+  }
+
   function buildData(locale) {
     const t = makeT(locale)
     const s = pool ? pool.status() : { total: 0, available: 0, cooling: 0, keys: [], stats: { requests: 0 } }
@@ -296,7 +354,7 @@ const modelRowOf = (entry, current, t) => {
     const model = String(config.model ?? '')
     const modelEntry = catalog?.resolve(model)
     const currentModel = modelEntry?.id ?? model
-    const models = (catalog?.entries ?? []).filter((entry) => isChatModel(entry.id))
+    const models = visibleModels()
     const routing = router.snapshot()
     const routed =
       routing.blockedPairs > 0 ? ` ${t('routed', { n: routing.blockedPairs })}` : ''
@@ -474,6 +532,7 @@ const modelRowOf = (entry, current, t) => {
         s.total === 0
           ? t('keyTitleEmpty')
           : t('keyTitlePage', { total: s.total, page: pageNo, pages: pageCount }),
+      newKey: '',
       keyPager:
         s.total > KEYS_PER_PAGE
           ? t('keyPager', { page: pageNo, pages: pageCount, size: KEYS_PER_PAGE })
@@ -618,6 +677,7 @@ const modelRowOf = (entry, current, t) => {
       keyTitle: d.keyTitle,
       keys: d.keys,
       focusTitle: d.focus.title,
+      newKey: '',
     }
   }
   const buildKeyData = (locale) => {
@@ -640,6 +700,20 @@ const modelRowOf = (entry, current, t) => {
       .filter((t) => /^ms-[A-Za-z0-9._-]{8,}$/.test(t))
       .filter((t, i, arr) => arr.indexOf(t) === i)
 
+  /** 表单提交回来的值形状不固定：字符串、{newKey}、{'data.newKey'} 都见过，统统认。 */
+  const pickText = (value) => {
+    if (typeof value === 'string') return value
+    if (!value || typeof value !== 'object') return ''
+    for (const key of ['newKey', 'data.newKey', 'value', 'text', 'input']) {
+      if (typeof value[key] === 'string' && value[key].trim()) return value[key]
+    }
+    for (const item of Object.values(value)) {
+      if (typeof item === 'string' && item.trim()) return item
+    }
+    return ''
+  }
+
+  /** 从泡里抠令牌、批量入库。入库是本地写文件，很快；认站点和查额度放后台。 */
   const addKey = async (raw, locale) => {
     const t = makeT(locale)
     const text = String(raw ?? '').trim()
@@ -656,33 +730,43 @@ const modelRowOf = (entry, current, t) => {
     }
     if (added.length === 0) return { toast: skipped[0] ?? t('toastNoNew') }
 
-    // 加进来就逐个问额度接口：既能认出站点，也能当场发现令牌无效或额度不够。
-    const regions = { ai: 0, cn: 0 }
-    let invalid = 0
-    let low = 0
-    for (const { id, token } of added) {
-      const state = await quota.refreshOne(id, token, { force: true })
-      if (!state?.ok) {
-        invalid++
-        pool.markFailure(id, '\u4ee4\u724c\u65e0\u6548', String(state?.error ?? '').slice(0, 80))
-        continue
-      }
-      if (state.region) {
-        regions[state.region]++
-        await pool.setRegion(id, state.region)
-      }
-      applyQuota(id, state)
-      if (state.available < QUOTA_FLOOR) low++
-    }
+    // 先给用户一个立刻的答复，几十个 Key 也不用等。
+    const bits = [t('addDone', { n: added.length })]
+    if (skipped.length > 0) bits.push(t('addSkipped', { n: skipped.length }))
     refreshPanel()
     refreshStrip()
 
-    const bits = [t('addDone', { n: added.length })]
-    if (regions.ai > 0) bits.push(t('addIntl', { n: regions.ai }))
-    if (regions.cn > 0) bits.push(t('addCn', { n: regions.cn }))
-    if (low > 0) bits.push(t('addLow', { n: low }))
-    if (invalid > 0) bits.push(t('addInvalid', { n: invalid }))
-    if (skipped.length > 0) bits.push(t('addSkipped', { n: skipped.length }))
+    // 后台逐个认站点 / 查额度：失败的不阻塞入库，也不影响下一批。
+    void (async () => {
+      let invalid = 0
+      let low = 0
+      const regions = { ai: 0, cn: 0 }
+      for (const { id, token } of added) {
+        try {
+          const state = await quota.refreshOne(id, token, { force: true })
+          if (!state?.ok) {
+            invalid++
+            pool.markFailure(id, '\u4ee4\u724c\u65e0\u6548', String(state?.error ?? '').slice(0, 80))
+            continue
+          }
+          if (state.region) {
+            regions[state.region]++
+            await pool.setRegion(id, state.region)
+          }
+          applyQuota(id, state)
+          if (state.available < QUOTA_FLOOR) low++
+        } catch {}
+      }
+      refreshPanel()
+      refreshStrip()
+      const tail = [t('addDone', { n: added.length })]
+      if (regions.ai > 0) tail.push(t('addIntl', { n: regions.ai }))
+      if (regions.cn > 0) tail.push(t('addCn', { n: regions.cn }))
+      if (low > 0) tail.push(t('addLow', { n: low }))
+      if (invalid > 0) tail.push(t('addInvalid', { n: invalid }))
+      setNotice(tail.join(t('joinArrow')))
+    })()
+
     return { toast: bits.join(t('joinArrow')) }
   }
 
@@ -718,14 +802,19 @@ const modelRowOf = (entry, current, t) => {
         ready
           .then(() => {
             tick()
+            kicks.add(tick)
             const timer = setInterval(tick, 1500)
             if (typeof timer.unref === 'function') timer.unref()
-            stop = () => clearInterval(timer)
+            stop = () => {
+              kicks.delete(tick)
+              clearInterval(timer)
+            }
           })
           .catch(() => {})
         let stop = () => {}
         return () => {
           stopped = true
+          kicks.delete(tick)
           stop()
         }
     }
@@ -733,15 +822,6 @@ const modelRowOf = (entry, current, t) => {
     // 点按必须 3 秒内返回，否则 App 会提示「没有响应」。
     // 联网的慢操作因此不在点按里等：先把一句话挂到面板顶部（data.hint），
     // 3 秒后自动收起，真正的活儿在后台继续跑，跑完再挂一句结果，同样 3 秒收起。
-    let notice = ''
-    let noticeUntil = 0
-    const setNotice = (text, ms = 3000) => {
-      notice = String(text ?? '')
-      noticeUntil = notice ? Date.now() + ms : 0
-      refreshPanel()
-      refreshStrip()
-    }
-    const noticeNow = () => (noticeUntil > Date.now() ? notice : '')
     const running = new Set()
     const runInBackground = (key, label, work) => {
       if (running.has(key)) return { toast: label }
@@ -889,14 +969,12 @@ const modelRowOf = (entry, current, t) => {
           })
           return { toast: t('toastDeleted', { id }), refresh: true }
         },
-        'add-form'(scope, event) {
+        async 'add-form'(scope, event) {
           const t = makeT(event?.locale)
-          const value = event?.value
-          const raw = typeof value === 'string' ? value : value?.newKey ?? value?.value ?? ''
-          return runInBackground('add', t('pendingAdd'), async () => {
-            const result = await addKey(raw, event?.locale)
-            return result?.toast ?? t('toastNoNew')
-          })
+          const raw = pickText(event?.value)
+          if (!raw) return { toast: t('toastNoInput'), refresh: true }
+          const result = await addKey(raw, event?.locale)
+          return { toast: result?.toast ?? t('toastNoNew'), refresh: true }
         },
         'key-back'() {
           return { open: 'panel:pool' }
@@ -950,16 +1028,6 @@ const modelRowOf = (entry, current, t) => {
       },
     })
 
-    dshGo.on('addkey', (scope, event) => {
-      const t = makeT(event?.locale)
-      const text = String(scope.clipboard ?? '').trim()
-      if (!text) return { toast: t('toastNoClipboard') }
-      return runInBackground('add', t('pendingAdd'), async () => {
-        const result = await addKey(text, event?.locale)
-        return result?.toast ?? t('toastNoNew')
-      })
-    })
-
     dshGo.on('open-pool', () => ({ open: 'panel:pool' }))
   })
 
@@ -1027,8 +1095,8 @@ const modelRowOf = (entry, current, t) => {
           entryId,
           getPort: () => proxy?.port ?? 0,
           getKey: () => config.apiKey,
-          getModels: () => catalog?.ids ?? [],
-          getEntries: () => catalog?.entries ?? [],
+          getModels: () => visibleModels().map((entry) => entry.id),
+          getEntries: () => visibleModels(),
           logger,
         })
         providerState = {

package/lib/web.js

@@ -9,64 +9,79 @@ const HTML = [
   '<!doctype html>',
   '<html lang="zh-CN"><head>',
   '<meta charset="utf-8">',
-  '<meta name="viewport" content="width=device-width,initial-scale=1">',
+  '<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">',
   '<title>ModelScope key pool</title>',
   '<style>',
-  ':root{color-scheme:light dark;--bg:#fff;--fg:#16181d;--muted:#6b7078;--line:#e3e6ea;--card:#f7f8fa;--good:#1f7a4d;--warn:#8a6100;--bad:#b3261e;--btn:#eceff3}',
-  '@media (prefers-color-scheme:dark){:root{--bg:#16181d;--fg:#e8eaee;--muted:#9aa0aa;--line:#2b2f36;--card:#1d2026;--good:#5fd39b;--warn:#e0b355;--bad:#ff8a80;--btn:#262b33}}',
-  '*{box-sizing:border-box}',
-  'body{margin:0;padding:16px 14px 40px;background:var(--bg);color:var(--fg);font:14px/1.5 -apple-system,system-ui,"Segoe UI",Roboto,"Noto Sans SC",sans-serif}',
-  'h1{margin:0 0 2px;font-size:18px}',
-  '.sub{color:var(--muted);font-size:12px;margin-bottom:14px}',
-  '.stats{display:flex;gap:10px;margin-bottom:12px}',
-  '.stat{flex:1;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px}',
-  '.stat b{display:block;font-size:20px;line-height:1.2}',
-  '.stat span{color:var(--muted);font-size:12px}',
-  '.bar{height:8px;border-radius:6px;background:var(--line);overflow:hidden;margin:6px 0 4px}',
-  '.bar i{display:block;height:100%;background:var(--good)}',
-  '.row{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}',
-  'button{background:var(--btn);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:7px 12px;font:inherit;cursor:pointer}',
-  'button:active{opacity:.7}',
-  'button.pri{background:var(--fg);color:var(--bg);border-color:var(--fg)}',
-  'table{width:100%;border-collapse:collapse;font-size:13px}',
-  'th,td{text-align:left;padding:7px 6px;border-bottom:1px solid var(--line);vertical-align:middle}',
-  'th{color:var(--muted);font-weight:500;font-size:12px}',
-  '.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}',
-  '.ok{color:var(--good)}.warn{color:var(--warn)}.bad{color:var(--bad)}',
-  '.muted{color:var(--muted)}',
-  'td.ops{white-space:nowrap;text-align:right}',
-  'td.ops button{padding:4px 8px;font-size:12px;margin-left:4px}',
-  'textarea,select{width:100%;background:var(--card);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:8px;font:inherit}',
-  'textarea{min-height:64px;resize:vertical}',
-  '.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:9px 16px;border-radius:20px;font-size:13px;opacity:0;transition:opacity .2s;pointer-events:none;max-width:88vw}',
-  '.toast.on{opacity:.95}',
-  'details{margin-top:18px}summary{cursor:pointer;color:var(--muted);font-size:13px}',
-  '</style></head><body>',
-  '<h1 id="title">魔搭 Key 池</h1>',
-  '<div class="sub" id="sub"></div>',
-  '<div class="stats">',
-  '<div class="stat"><b id="s-ok">–</b><span id="l-ok"></span></div>',
-  '<div class="stat"><b id="s-cool">–</b><span id="l-cool"></span></div>',
-  '<div class="stat"><b id="s-magic">–</b><span id="l-magic"></span></div>',
-  '</div>',
-  '<div class="bar"><i id="bar" style="width:0"></i></div>',
-  '<div class="sub" id="magic-cap"></div>',
-  '<div class="row">',
+  ':root{color-scheme:light dark;--bg:#f6f7f9;--card:#fff;--fg:#14171d;--muted:#6b7280;--line:#e5e7eb;--accent:#0f766e;--accent-fg:#fff;--good:#15803d;--warn:#a16207;--bad:#b91c1c;--chip:#eef1f5}',
+  '@media (prefers-color-scheme:dark){:root{--bg:#14161a;--card:#1c1f25;--fg:#e9ebef;--muted:#9aa1ad;--line:#2b3038;--accent:#2dd4bf;--accent-fg:#0b0d10;--good:#4ade80;--warn:#fbbf24;--bad:#f87171;--chip:#242932}}',
+  '*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}',
+  'body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.55 -apple-system,system-ui,"Segoe UI",Roboto,"Noto Sans SC",sans-serif;padding:0 14px 40px}',
+  '.wrap{max-width:760px;margin:0 auto}',
+  'header{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:14px 0 10px;background:linear-gradient(var(--bg) 78%,transparent)}',
+  'header h1{margin:0;font-size:19px;font-weight:650;letter-spacing:.2px}',
+  'header .sub{margin:2px 0 0;color:var(--muted);font-size:12px}',
+  'header .grow{flex:1;min-width:0}',
+  '.ghost{background:var(--chip);border:1px solid var(--line);color:var(--fg);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px}',
+  '.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:6px 0 14px}',
+  '.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 13px}',
+  '.card b{display:block;font-size:24px;line-height:1.15;font-weight:680;font-variant-numeric:tabular-nums}',
+  '.card span{display:block;margin-top:2px;color:var(--muted);font-size:12px}',
+  '.card.ok b{color:var(--good)}.card.warn b{color:var(--warn)}.card.info b{color:var(--accent)}',
+  '.magic{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 13px;margin-bottom:14px}',
+  '.magic .row{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted)}',
+  '.magic .row b{color:var(--fg);font-weight:600;font-size:13px}',
+  '.bar{height:9px;border-radius:99px;background:var(--chip);overflow:hidden;margin-top:9px}',
+  '.bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 55%,#fff));transition:width .35s ease}',
+  '.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}',
+  'button{font:inherit;border-radius:11px;border:1px solid var(--line);background:var(--card);color:var(--fg);padding:9px 14px;cursor:pointer}',
+  'button:active{transform:scale(.985)}',
+  'button.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-fg);font-weight:600}',
+  '.tablewrap{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}',
+  'table{width:100%;border-collapse:collapse;font-size:13.5px}',
+  'thead th{position:sticky;top:0;background:var(--card);color:var(--muted);font-weight:500;font-size:12px;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}',
+  'tbody td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}',
+  'tbody tr:last-child td{border-bottom:0}',
+  'tbody tr:nth-child(even){background:color-mix(in srgb,var(--chip) 45%,transparent)}',
+  '.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}',
+  '.ok{color:var(--good)}.warn{color:var(--warn)}.bad{color:var(--bad)}.muted{color:var(--muted)}',
+  'td.ops{text-align:right;white-space:nowrap}',
+  'td.ops button{padding:5px 9px;font-size:12px;border-radius:8px;margin-left:5px;background:transparent}',
+  'td.ops button:hover{background:var(--chip)}',
+  'td.ops button.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 35%,var(--line))}',
+  '.pager{display:flex;align-items:center;justify-content:center;gap:12px;margin:12px 0 18px;color:var(--muted);font-size:13px}',
+  '.pager button{padding:7px 14px}',
+  '.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px;margin-bottom:14px}',
+  '.panel h2{margin:0 0 9px;font-size:14px;font-weight:600}',
+  'textarea,select{width:100%;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:11px;padding:10px 12px;font:inherit;font-size:14px}',
+  'textarea{min-height:86px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}',
+  '.panel .foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:9px}',
+  '.panel .foot span{color:var(--muted);font-size:12px}',
+  '.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(8px);background:var(--fg);color:var(--bg);padding:10px 18px;border-radius:999px;font-size:13px;opacity:0;transition:opacity .18s,transform .18s;pointer-events:none;max-width:90vw;z-index:20}',
+  '.toast.on{opacity:.96;transform:translateX(-50%) translateY(0)}',
+  '@media (max-width:430px){.cards{grid-template-columns:repeat(3,1fr);gap:8px}.card{padding:10px}.card b{font-size:20px}td.ops button{padding:5px 7px;margin-left:4px}}',
+  '</style></head><body><div class="wrap">',
+  '<header><div class="grow"><h1 id="title">魔搭 Key 池</h1><p class="sub" id="sub"></p></div>',
+  '<button class="ghost" id="b-lang">English</button></header>',
+  '<section class="cards">',
+  '<div class="card ok"><b id="s-ok">–</b><span id="l-ok"></span></div>',
+  '<div class="card warn"><b id="s-cool">–</b><span id="l-cool"></span></div>',
+  '<div class="card info"><b id="s-magic">–</b><span id="l-magic"></span></div>',
+  '</section>',
+  '<section class="magic"><div class="row"><b id="magic-label"></b><span id="magic-cap"></span></div>',
+  '<div class="bar"><i id="bar" style="width:0"></i></div></section>',
+  '<div class="toolbar">',
   '<button class="pri" data-act="refresh" id="b-refresh"></button>',
   '<button data-act="test" id="b-test"></button>',
   '<button data-act="restoreAll" id="b-restore"></button>',
-  '<button id="b-lang"></button>',
   '</div>',
-  '<table><thead><tr id="head"></tr></thead><tbody id="rows"></tbody></table>',
-  '<div class="row"><button id="b-prev"></button><button id="b-next"></button></div>',
-  '<details><summary id="add-sum"></summary>',
-  '<div class="row"><textarea id="add-text" placeholder="ms-..."></textarea></div>',
-  '<div class="row"><button class="pri" id="b-add"></button></div>',
-  '</details>',
-  '<details><summary id="model-sum"></summary>',
-  '<div class="row"><select id="model-sel"></select></div>',
-  '</details>',
+  '<div class="tablewrap"><table><thead><tr id="head"></tr></thead><tbody id="rows"></tbody></table></div>',
+  '<div class="pager"><button id="b-prev"></button><span id="page-info"></span><button id="b-next"></button></div>',
+  '<section class="panel"><h2 id="add-sum"></h2>',
+  '<textarea id="add-text" placeholder="ms-..."></textarea>',
+  '<div class="foot"><span id="add-hint"></span><button class="pri" id="b-add"></button></div></section>',
+  '<section class="panel"><h2 id="model-sum"></h2><select id="model-sel"></select></section>',
   '<div class="toast" id="toast"></div>',
+  '</div>',
   '<script>',
   'var L=null,S=null,PAGE=0,PER=20,ARM="";',
   'var DICT={',
@@ -109,13 +124,17 @@ const HTML = [
   ' document.getElementById("l-magic").textContent=L.magic;',
   ' var pct=S.magic.total>0?Math.max(0,Math.min(100,S.magic.left/S.magic.total*100)):0;',
   ' document.getElementById("bar").style.width=pct.toFixed(1)+"%";',
-  ' document.getElementById("magic-cap").textContent=" "+L.left+" "+S.magic.left+" / "+L.total+" "+S.magic.total;',
+  ' document.getElementById("magic-label").textContent=L.usage;',
+  ' document.getElementById("magic-cap").textContent=L.left+" "+S.magic.left+" / "+L.total+" "+S.magic.total;',
+  ' document.getElementById("add-hint").textContent=L.addHint;',
   ' document.getElementById("b-refresh").textContent=L.refresh;',
   ' document.getElementById("b-test").textContent=L.test;',
   ' document.getElementById("b-restore").textContent=L.restoreAll;',
   ' document.getElementById("b-prev").textContent=L.prev;',
   ' document.getElementById("b-next").textContent=L.next;',
   ' document.getElementById("b-add").textContent=L.add;',
+  ' var pg=document.getElementById("page-info");',
+  ' if(pg){var total=Math.max(1,Math.ceil(S.keys.length/PER));pg.textContent=L.page.replace("{p}",String(PAGE+1)).replace("{n}",String(total))}',
   ' document.getElementById("add-sum").textContent=L.addSum;',
   ' document.getElementById("model-sum").textContent=L.modelSum;',
   ' var head=document.getElementById("head");head.innerHTML="";',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-modelscope-pool",
-  "version": "0.10.2",
-  "description": "魔搭多 Key 聚合网关：无感路由（模型不变，Key 遇限流/额度不足/无权限/不存在自动换下一个）；自动识别国际版/国内版令牌；单个 Key 可禁用/停用/恢复/删除/查看；全部密钥分页浏览；模型实际拉取国际版+国内版合并成简化名、按站点分组；额度低于 2 停用到次日 00:01、多 Key 轮换、限流临时失败冷却 5 分钟，并注册为 DSH 模型供应商",
+  "version": "0.11.0",
+  "description": "魔搭多 Key 聚合网关 + DSH 原生插件：模型不变，Key 遇限流、额度不足、无权限或令牌失效自动无感换下一个；自动识别国际版/国内版令牌；Key 池管理、魔粒用量、多语言界面；也可在网页版/桌面版管理。",
   "license": "MIT",
   "author": "Yizutt",
   "repository": {
@@ -39,28 +39,7 @@
       "en": "ModelScope keys"
     },
     "icon": "cloud",
-    "wants": [
-      "clipboard"
-    ],
     "contributes": {
-      "composer.actions": [
-        {
-          "id": "addkey",
-          "label": {
-            "zh": "添加 Key",
-            "en": "Add key"
-          },
-          "icon": "paste"
-        },
-        {
-          "id": "open-pool",
-          "label": {
-            "zh": "Key 池",
-            "en": "Key pool"
-          },
-          "icon": "cloud"
-        }
-      ],
       "composer.strip": [
         {
           "id": "pool-strip",