fix(ui): correct account labels, proxy actions and usage defaults

Reuse account identity labels in concurrency details and use a text button
for reset-credit lead time settings. Disable row tests during batch proxy
testing while retaining loading feedback for individual tests.

Default the usage date range to today.

Co-authored-by: Codex <noreply@openai.com>
This commit is contained in:
Zyy
2026-10-17 22:00:16 +08:00
co-authored by Codex
parent 45954899e5
commit 349e983eb7
7 changed files with 26 additions and 16 deletions
@@ -2,17 +2,19 @@
import type { Account } from '@/api'
import { ZDialog, ZIconButton, ZPagination } from '@codex-proxy/ui'
import { Grid2X2, RefreshCw } from '@lucide/vue'
import { toRef } from 'vue'
import { computed, toRef } from 'vue'
import { useAccountConcurrency } from '../composables/useAccountConcurrency'
import { accountIdentityLabel } from '../utils/accountIdentity'
import AccountConcurrencyTable from './AccountConcurrencyTable.vue'
const props = defineProps<{ account: Account | null }>()
const open = defineModel<boolean>({ required: true })
const accountLabel = computed(() => props.account ? accountIdentityLabel(props.account) : '当前账号')
const { pageSize, data, entries, loading, tableLoading, error, refresh, setPage, setPageSize } = useAccountConcurrency(toRef(props, 'account'), open)
</script>
<template>
<ZDialog v-model="open" title="并发明细" :description="`${account?.name ?? '当前账号'} · 当前正在处理的请求`" width="72rem">
<ZDialog v-model="open" title="并发明细" :description="`${accountLabel} · 当前正在处理的请求`" width="72rem">
<div class="grid min-w-0 gap-2">
<div class="flex items-center justify-between gap-3">
<div class="flex items-center gap-1.5 text-cp-sm" role="group" aria-label="当前占用 / 并发上限">
@@ -5,6 +5,7 @@ import { computed } from 'vue'
import AccountPlanBadge from '@/components/account/AccountPlanBadge.vue'
import { stablePresetVisualToneClass } from '@/utils/color'
import { accountIdentityLabel } from '../utils/accountIdentity'
import AccountNotesPopover from './AccountNotesPopover.vue'
type AccountIdentity = Pick<Account, 'id' | 'email' | 'planType' | 'planTypeDisplay'>
@@ -30,16 +31,7 @@ const props = withDefaults(
},
)
const emailText = computed(() => {
if (props.account.authenticationKind === 'api_key' && props.account.name)
return props.account.name
const email = props.account.email?.trim()
if (email)
return email
if ('accountId' in props.account && typeof props.account.accountId === 'string')
return props.account.accountId
return String(props.account.id)
})
const emailText = computed(() => accountIdentityLabel(props.account))
const visibleNotes = computed(() => props.showNotes ? props.account.notes : undefined)
@@ -86,7 +86,7 @@ watch(() => props.accountId, () => {
</ZPopover>
</div>
<div class="flex items-center gap-3">
<ZButton size="small" variant="link" aria-label="设置全局提前时间" @click="router.push('/settings#reset-credits')">
<ZButton size="small" variant="text" aria-label="设置全局提前时间" @click="router.push('/settings#reset-credits')">
<template #icon>
<Clock3 class="size-3.5 -translate-y-px" />
</template>
@@ -0,0 +1,15 @@
import type { Account } from '@/api'
type AccountIdentity = Pick<Account, 'id' | 'email'>
& Partial<Pick<Account, 'accountId' | 'name' | 'authenticationKind'>>
export function accountIdentityLabel(account: AccountIdentity): string {
if (account.authenticationKind === 'api_key' && account.name)
return account.name
const email = account.email?.trim()
if (email)
return email
if (typeof account.accountId === 'string')
return account.accountId
return String(account.id)
}
@@ -6,6 +6,7 @@ import { MoreHorizontal, Pencil, Power, Trash2, Wifi } from '@lucide/vue'
defineProps<{
proxy: OutboundProxyRecord
testing: boolean
batchTesting: boolean
updating: boolean
}>()
@@ -19,7 +20,7 @@ const emit = defineEmits<{
<template>
<div class="flex items-center gap-0.5">
<ZIconButton size="small" aria-label="测试代理" :loading="testing" :disabled="testing || updating" @click="emit('test', proxy)">
<ZIconButton size="small" aria-label="测试代理" :loading="testing && !batchTesting" :disabled="batchTesting || testing || updating" @click="emit('test', proxy)">
<Wifi class="size-3.5 text-cp-link" />
</ZIconButton>
<ZIconButton size="small" aria-label="编辑代理" :disabled="testing || updating" @click="emit('edit', proxy)">
+1 -1
View File
@@ -152,7 +152,7 @@ watch(search, () => {
{{ row.lastTestAtDisplay ?? '-' }}
</template>
<template #actions="{ row }">
<ProxyActions :proxy="row" :testing="testingIds.has(row.id)" :updating="updatingIds.has(row.id)" @test="checkProxy" @edit="openForm" @toggle="toggleEnabled" @delete="requestDelete" />
<ProxyActions :proxy="row" :testing="testingIds.has(row.id)" :batch-testing="batchTesting" :updating="updatingIds.has(row.id)" @test="checkProxy" @edit="openForm" @toggle="toggleEnabled" @delete="requestDelete" />
</template>
</ZTable>
<ZPagination v-bind="pagination" :disabled="loading" @current-change="setPage" @size-change="setPageSize" />
@@ -12,7 +12,7 @@ function dateStart(date: Date, offset = 0) {
export function useUsageTimeRange() {
const now = new Date()
const selectedDates = shallowRef<[Date, Date]>([dateStart(now, -6), dateStart(now)])
const selectedDates = shallowRef<[Date, Date]>([dateStart(now), dateStart(now)])
const timeRange = computed<DatePickerValue>({
get: () => selectedDates.value,
set: (value) => {