i/Aether
1
0
Fork 0
mirror of https://github.com/fawney19/Aether.git synced 2026-10-06 17:37:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(frontend): refine badges and cycle stats

Browse Source
This commit is contained in:
elky
2026-07-18 00:05:22 +08:00
parent 88a057b8d9
commit e558f55cd9
8 changed files with 53 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/features/usage/components/UsageModelDisplay.vue
+7 -3
View File
@@ -30,7 +30,7 @@
:key="badge.key"
:data-usage-model-badge="badge.key"
:data-request-detail-model-badge="context === 'detail' ? badge.key : undefined"
variant="outline"
:variant="badge.variant"
class="h-4 shrink-0 whitespace-nowrap rounded-full px-1.5 text-[10px] leading-4"
:class="badge.className"
:title="badge.title"
@@ -52,7 +52,7 @@
:key="badge.key"
:data-usage-model-badge="badge.key"
:data-request-detail-model-badge="context === 'detail' ? badge.key : undefined"
variant="outline"
:variant="badge.variant"
class="h-4 shrink-0 whitespace-nowrap rounded-full px-1.5 text-[10px] leading-4"
:class="badge.className"
:title="badge.title"
@@ -76,6 +76,7 @@ type ModelBadgeKey = 'reasoning' | 'fast' | 'cyber'
interface ModelBadgePresentation {
key: ModelBadgeKey
label: string
variant: 'outline' | 'outline-transparent'
className: string
title: string
ariaLabel: string
@@ -130,6 +131,7 @@ const modelBadges = computed<ModelBadgePresentation[]>(() => {
badges.push({
key: 'reasoning',
label: reasoningLabel.value,
variant: 'outline',
className: 'border-primary/30 bg-primary/5 text-primary',
title: `Reasoning: ${reasoningLabel.value}`,
ariaLabel: `Reasoning: ${reasoningLabel.value}`,
@@ -140,7 +142,8 @@ const modelBadges = computed<ModelBadgePresentation[]>(() => {
badges.push({
key: 'fast',
label: 'Fast',
className: 'border-amber-400/50 !bg-transparent text-amber-700 dark:border-amber-300/40 dark:text-amber-300',
variant: 'outline-transparent',
className: 'text-amber-700 dark:text-amber-300',
title: '上游请求档位：Fast\n计费档位：Fast',
ariaLabel: '上游请求档位：Fast，计费档位：Fast',
})
@@ -150,6 +153,7 @@ const modelBadges = computed<ModelBadgePresentation[]>(() => {
badges.push({
key: 'cyber',
label: 'Cyber',
variant: 'outline',
className: 'border-primary/30 bg-primary/5 text-rose-600 dark:text-rose-300',
title: '上游 Cyber Policy 拒绝',
ariaLabel: '上游 Cyber Policy 拒绝',
frontend/src/features/usage/components/UsageRecordsTable.vue
+1 -1
View File
@@ -1579,7 +1579,7 @@ function buildServiceTierBadgePresentation(
const title = titleLines.join('\n')
return {
label: 'Fast',
className: 'border-amber-400/50 !bg-transparent text-amber-700 dark:border-amber-300/40 dark:text-amber-300',
className: '!bg-transparent text-amber-700 dark:text-amber-300',
title,
ariaLabel: titleLines.join('，'),
}
frontend/src/features/usage/components/__tests__/UsageRecordsTable.spec.ts
+3 -3
View File
@@ -339,9 +339,9 @@ describe('UsageRecordsTable', () => {
expect(reasoningBadge?.classList.contains('border-primary/30')).toBe(true)
expect(reasoningBadge?.classList.contains('bg-primary/5')).toBe(true)
expect(reasoningBadge?.classList.contains('text-primary')).toBe(true)
expect(fastBadge?.classList.contains('border-amber-400/50')).toBe(true)
expect(fastBadge?.classList.contains('!bg-transparent')).toBe(true)
expect(fastBadge?.classList.contains('bg-transparent')).toBe(false)
expect(fastBadge?.getAttribute('variant')).toBe('outline-transparent')
expect(fastBadge?.classList.contains('border-amber-400/50')).toBe(false)
expect(fastBadge?.classList.contains('!bg-transparent')).toBe(false)
expect(fastBadge?.classList.contains('bg-amber-400/10')).toBe(false)
expect(fastBadge?.classList.contains('text-amber-700')).toBe(true)
expect(cyberBadge?.classList.contains('border-primary/30')).toBe(true)