lisone/ds2api
1
0
Fork 0
mirror of https://github.com/CJackHwang/ds2api.git synced 2026-05-11 03:37:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(account): add key/account name and remark metadata

Browse Source
This commit is contained in:
CJACK.
2026-04-22 01:43:20 +08:00
parent d848d24a82
commit 8ff923cd77
16 changed files with 291 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
webui/src/features/account/AccountsTable.jsx
View File

@@ -118,6 +118,7 @@ export default function AccountsTable({
runtimeUnknown ? "bg-blue-500 shadow-[0_0_8px_rgba(59,130,246,0.5)]" : "bg-amber-500"
)} />
<div className="min-w-0">
<div className="text-sm font-medium truncate">{acc.name || '-'}</div>
<div
className="font-medium truncate flex items-center gap-1.5 cursor-pointer hover:text-primary transition-colors group"
onClick={() => copyId(id)}
@@ -128,6 +129,9 @@ export default function AccountsTable({
: <Copy className="w-3 h-3 opacity-0 group-hover:opacity-50 shrink-0 transition-opacity" />
}
</div>
{acc.remark && (
<div className="text-xs text-muted-foreground truncate mt-0.5">{acc.remark}</div>
)}
<div className="flex items-center gap-2 text-xs text-muted-foreground mt-0.5">
<span>{acc.test_status === 'failed' ? t('accountManager.testStatusFailed') : isActive ? t('accountManager.sessionActive') : runtimeUnknown ? t('accountManager.runtimeStatusUnknown') : t('accountManager.reauthRequired')}</span>
{acc.token_preview && (

20
webui/src/features/account/AddAccountModal.jsx
View File

@@ -23,6 +23,26 @@ export default function AddAccountModal({
</button>
</div>
<div className="p-6 space-y-4">
<div>
<label className="block text-sm font-medium mb-1.5">{t('accountManager.nameOptional')}</label>
<input
type="text"
className="input-field"
placeholder={t('accountManager.namePlaceholder')}
value={newAccount.name}
onChange={e => setNewAccount({ ...newAccount, name: e.target.value })}
/>
</div>
<div>
<label className="block text-sm font-medium mb-1.5">{t('accountManager.remarkOptional')}</label>
<input
type="text"
className="input-field"
placeholder={t('accountManager.remarkPlaceholder')}
value={newAccount.remark}
onChange={e => setNewAccount({ ...newAccount, remark: e.target.value })}
/>
</div>
<div>
<label className="block text-sm font-medium mb-1.5">{t('accountManager.emailOptional')}</label>
<input

26
webui/src/features/account/AddKeyModal.jsx
View File

@@ -22,13 +22,13 @@ export default function AddKeyModal({ show, t, newKey, setNewKey, loading, onClo
type="text"
className="input-field bg-[#09090b] flex-1"
placeholder={t('accountManager.newKeyPlaceholder')}
value={newKey}
onChange={e => setNewKey(e.target.value)}
value={newKey.key}
onChange={e => setNewKey({ ...newKey, key: e.target.value })}
autoFocus
/>
<button
type="button"
onClick={() => setNewKey('sk-' + crypto.randomUUID().replace(/-/g, ''))}
onClick={() => setNewKey({ ...newKey, key: 'sk-' + crypto.randomUUID().replace(/-/g, '') })}
className="px-3 py-2 bg-secondary text-secondary-foreground rounded-lg hover:bg-secondary/80 transition-colors text-sm font-medium border border-border whitespace-nowrap"
>
{t('accountManager.generate')}
@@ -36,6 +36,26 @@ export default function AddKeyModal({ show, t, newKey, setNewKey, loading, onClo
</div>
<p className="text-xs text-muted-foreground mt-1.5">{t('accountManager.generateHint')}</p>
</div>
<div>
<label className="block text-sm font-medium mb-1.5">{t('accountManager.nameOptional')}</label>
<input
type="text"
className="input-field"
placeholder={t('accountManager.namePlaceholder')}
value={newKey.name}
onChange={e => setNewKey({ ...newKey, name: e.target.value })}
/>
</div>
<div>
<label className="block text-sm font-medium mb-1.5">{t('accountManager.remarkOptional')}</label>
<input
type="text"
className="input-field"
placeholder={t('accountManager.remarkPlaceholder')}
value={newKey.remark}
onChange={e => setNewKey({ ...newKey, remark: e.target.value })}
/>
</div>
<div className="flex justify-end gap-2 pt-2">
<button onClick={onClose} className="px-4 py-2 rounded-lg border border-border hover:bg-secondary transition-colors text-sm font-medium">{t('actions.cancel')}</button>
<button onClick={onAdd} disabled={loading} className="px-4 py-2 bg-primary text-primary-foreground rounded-lg hover:bg-primary/90 transition-colors text-sm font-medium disabled:opacity-50">

27
webui/src/features/account/ApiKeysPanel.jsx
View File

@@ -37,6 +37,9 @@ export default function ApiKeysPanel({
onDeleteKey,
}) {
const [failedKey, setFailedKey] = useState(null)
const apiKeys = Array.isArray(config?.api_keys) && config.api_keys.length > 0
? config.api_keys
: (config?.keys || []).map(key => ({ key, name: '', remark: '' }))
const handleCopyKey = async (key) => {
try {
@@ -74,7 +77,7 @@ export default function ApiKeysPanel({
)} />
<div>
<h2 className="text-lg font-semibold">{t('accountManager.apiKeysTitle')}</h2>
<p className="text-sm text-muted-foreground">{t('accountManager.apiKeysDesc')} ({config.keys?.length || 0})</p>
<p className="text-sm text-muted-foreground">{t('accountManager.apiKeysDesc')} ({apiKeys.length || 0})</p>
</div>
</div>
<button
@@ -88,34 +91,36 @@ export default function ApiKeysPanel({
{keysExpanded && (
<div className="divide-y divide-border border-t border-border">
{config.keys?.length > 0 ? (
config.keys.map((key, i) => (
{apiKeys.length > 0 ? (
apiKeys.map((item, i) => (
<div key={i} className="p-4 flex items-center justify-between hover:bg-muted/50 transition-colors group">
<div className="flex items-center gap-2">
<div className="grid grid-cols-1 md:grid-cols-3 gap-2 flex-1">
<div className="text-sm">{item.name || '-'}</div>
<button
onClick={() => handleCopyKey(key)}
onClick={() => handleCopyKey(item.key)}
className="font-mono text-sm bg-muted/50 px-3 py-1 rounded inline-block hover:bg-muted transition-colors"
title={t('accountManager.copyKeyTitle')}
>
{key.slice(0, 16)}****
{(item.key || '').slice(0, 16)}****
</button>
{copiedKey === key && (
<div className="text-sm text-muted-foreground truncate">{item.remark || '-'}</div>
{copiedKey === item.key && (
<span className="text-xs text-green-500 animate-pulse">{t('accountManager.copied')}</span>
)}
{failedKey === key && (
{failedKey === item.key && (
<span className="text-xs text-destructive">{t('accountManager.copyFailed')}</span>
)}
</div>
<div className="flex items-center gap-1">
<button
onClick={() => handleCopyKey(key)}
onClick={() => handleCopyKey(item.key)}
className="p-2 text-muted-foreground hover:text-primary hover:bg-primary/10 rounded-md transition-colors"
title={t('accountManager.copyKeyTitle')}
>
{copiedKey === key ? <Check className="w-4 h-4 text-green-500" /> : <Copy className="w-4 h-4" />}
{copiedKey === item.key ? <Check className="w-4 h-4 text-green-500" /> : <Copy className="w-4 h-4" />}
</button>
<button
onClick={() => onDeleteKey(key)}
onClick={() => onDeleteKey(item.key)}
className="p-2 text-muted-foreground hover:text-destructive hover:bg-destructive/10 rounded-md transition-colors"
title={t('accountManager.deleteKeyTitle')}
>

12
webui/src/features/account/useAccountActions.js
View File

@@ -3,9 +3,9 @@ import { useState } from 'react'
export function useAccountActions({ apiFetch, t, onMessage, onRefresh, config, fetchAccounts, resolveAccountIdentifier }) {
const [showAddKey, setShowAddKey] = useState(false)
const [showAddAccount, setShowAddAccount] = useState(false)
const [newKey, setNewKey] = useState('')
const [newKey, setNewKey] = useState({ key: '', name: '', remark: '' })
const [copiedKey, setCopiedKey] = useState(null)
const [newAccount, setNewAccount] = useState({ email: '', mobile: '', password: '' })
const [newAccount, setNewAccount] = useState({ name: '', remark: '', email: '', mobile: '', password: '' })
const [loading, setLoading] = useState(false)
const [testing, setTesting] = useState({})
const [testingAll, setTestingAll] = useState(false)
@@ -15,17 +15,17 @@ export function useAccountActions({ apiFetch, t, onMessage, onRefresh, config, f
const [updatingProxy, setUpdatingProxy] = useState({})
const addKey = async () => {
if (!newKey.trim()) return
if (!newKey.key.trim()) return
setLoading(true)
try {
const res = await apiFetch('/admin/keys', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ key: newKey.trim() }),
body: JSON.stringify({ key: newKey.key.trim(), name: newKey.name, remark: newKey.remark }),
})
if (res.ok) {
onMessage('success', t('accountManager.addKeySuccess'))
setNewKey('')
setNewKey({ key: '', name: '', remark: '' })
setShowAddKey(false)
onRefresh()
} else {
@@ -68,7 +68,7 @@ export function useAccountActions({ apiFetch, t, onMessage, onRefresh, config, f
})
if (res.ok) {
onMessage('success', t('accountManager.addAccountSuccess'))
setNewAccount({ email: '', mobile: '', password: '' })
setNewAccount({ name: '', remark: '', email: '', mobile: '', password: '' })
setShowAddAccount(false)
fetchAccounts(1)
onRefresh()

4
webui/src/locales/en.json
View File

@@ -131,6 +131,10 @@
"addKeyLoading": "Adding...",
"addKeyAction": "Add key",
"modalAddAccountTitle": "Add DeepSeek account",
"nameOptional": "Name (optional)",
"namePlaceholder": "e.g. Primary Account A",
"remarkOptional": "Remark (optional)",
"remarkPlaceholder": "e.g. Team shared / test only",
"emailOptional": "Email (optional)",
"mobileOptional": "Mobile (optional)",
"passwordLabel": "Password",

4
webui/src/locales/zh.json
View File

@@ -131,6 +131,10 @@
"addKeyLoading": "添加中...",
"addKeyAction": "添加密钥",
"modalAddAccountTitle": "添加 DeepSeek 账号",
"nameOptional": "名称（可选）",
"namePlaceholder": "例如：主账号 A",
"remarkOptional": "备注（可选）",
"remarkPlaceholder": "例如：团队共享 / 仅测试用",
"emailOptional": "邮箱 (可选)",
"mobileOptional": "手机号 (可选)",
"passwordLabel": "密码",