mirror of
https://github.com/zyycn/codex-proxy-rs.git
synced 2026-11-07 00:05:49 +00:00
fix(ui): refine account and usage empty states
Leave absent account timestamps blank, show zero latency for an empty usage summary, and reduce the expanded sidebar width by five pixels. Co-authored-by: Codex <noreply@openai.com>
This commit is contained in:
@@ -118,7 +118,11 @@ const sidebarEl = ref<HTMLElement | null>(null)
|
||||
const brandLabelEl = ref<HTMLElement | null>(null)
|
||||
const navSignalEl = useTemplateRef<HTMLElement>('navSignal')
|
||||
const isCollapsed = computed(() => !props.mobile && Boolean(props.collapsed))
|
||||
const sidebarWidth = computed(() => (isCollapsed.value ? 88 : 256))
|
||||
const collapsedSidebarWidth = 88
|
||||
const expandedSidebarWidth = 251
|
||||
const sidebarWidth = computed(() =>
|
||||
isCollapsed.value ? collapsedSidebarWidth : expandedSidebarWidth,
|
||||
)
|
||||
const brandLabelVisible = shallowRef(!isCollapsed.value)
|
||||
const themeToggleLabel = computed(() =>
|
||||
effectiveTheme.value === 'dark' ? '切换浅色模式' : '切换暗黑模式',
|
||||
@@ -209,7 +213,7 @@ function animateSidebarWidth(collapsed: boolean) {
|
||||
return
|
||||
}
|
||||
|
||||
const targetWidth = collapsed ? 88 : 256
|
||||
const targetWidth = collapsed ? collapsedSidebarWidth : expandedSidebarWidth
|
||||
const currentWidth = sidebarEl.value.getBoundingClientRect().width
|
||||
|
||||
if (prefersReducedMotion()) {
|
||||
@@ -326,7 +330,7 @@ onBeforeUnmount(() => {
|
||||
class="z-20 h-dvh shrink-0 flex-col overflow-hidden bg-(--cp-bg-surface) px-4 shadow-(--cp-shadow-sidebar)"
|
||||
:class="[
|
||||
mobile ? 'flex' : 'hidden min-[961px]:flex',
|
||||
isCollapsed ? 'w-22 basis-22 items-center' : 'w-64 basis-64',
|
||||
isCollapsed ? 'w-22 basis-22 items-center' : 'w-[251px] basis-[251px]',
|
||||
]"
|
||||
>
|
||||
<div
|
||||
|
||||
@@ -98,7 +98,8 @@ export const accountColumns = [
|
||||
sortable: true,
|
||||
flex: 1.2,
|
||||
minWidth: '160px',
|
||||
format: (_value: unknown, row: AccountRow) => row.usage.lastUsedAtDisplay,
|
||||
format: (_value: unknown, row: AccountRow) => optionalAccountCell(row.usage.lastUsedAtDisplay),
|
||||
emptyText: '',
|
||||
cellClass: `${relaxedCellClass} text-(--cp-text-secondary)`,
|
||||
},
|
||||
{
|
||||
@@ -108,6 +109,8 @@ export const accountColumns = [
|
||||
sortKey: 'expiresAt',
|
||||
flex: 1.2,
|
||||
minWidth: '160px',
|
||||
format: value => optionalAccountCell(value),
|
||||
emptyText: '',
|
||||
cellClass: `${relaxedCellClass} text-(--cp-text-secondary)`,
|
||||
},
|
||||
{
|
||||
@@ -201,3 +204,7 @@ function accountProviderLabel(value?: string | null) {
|
||||
return 'xAI'
|
||||
return value || '—'
|
||||
}
|
||||
|
||||
function optionalAccountCell(value: unknown) {
|
||||
return value === '—' || value === '-' ? '' : value
|
||||
}
|
||||
|
||||
@@ -9,6 +9,10 @@ const props = defineProps<{
|
||||
summary: Awaited<ReturnType<typeof getUsageRecordSummary>>
|
||||
}>()
|
||||
|
||||
function averageLatencyDisplay(value: string) {
|
||||
return !value || value === '—' || value === '-' ? '0 ms' : value
|
||||
}
|
||||
|
||||
const items = computed(() => [
|
||||
{
|
||||
key: 'requests',
|
||||
@@ -38,7 +42,7 @@ const items = computed(() => [
|
||||
key: 'latency',
|
||||
label: '平均耗时',
|
||||
icon: Timer,
|
||||
value: props.summary.averageLatencyMs,
|
||||
value: averageLatencyDisplay(props.summary.averageLatencyMs),
|
||||
detail: '成功请求平均值',
|
||||
tone: 'text-(--cp-normal-text) bg-(--cp-normal-bg)',
|
||||
},
|
||||
|
||||
@@ -247,7 +247,7 @@ function emptySummary() {
|
||||
cachedTokens: '0',
|
||||
cacheWriteTokens: '0',
|
||||
totalTokens: '0',
|
||||
averageLatencyMs: '—',
|
||||
averageLatencyMs: '0 ms',
|
||||
}
|
||||
return summary
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user