diff --git a/apps/admin-web/src/components/PublishArticleModal.vue b/apps/admin-web/src/components/PublishArticleModal.vue index 9a102c1..911c288 100644 --- a/apps/admin-web/src/components/PublishArticleModal.vue +++ b/apps/admin-web/src/components/PublishArticleModal.vue @@ -35,6 +35,7 @@ import { buildPublishPlatformMap, clientStatusColor, clientStatusLabel, + clientStatusTooltip, healthColor, healthLabel, publishStateLabel, @@ -795,7 +796,7 @@ function decisionAlertType(result: ComplianceCheckResult | null | undefined) { 'publish-modal__card--active': isSelected(account.id), 'publish-modal__card--disabled': !account.selectable || accountSelectionLocked, }" - :disabled="!account.selectable || accountSelectionLocked" + :aria-disabled="!account.selectable || accountSelectionLocked" @click="toggleAccount(account.id, account.selectable)" >
@@ -810,7 +811,17 @@ function decisionAlertType(result: ComplianceCheckResult | null | undefined) { {{ accountInitial(account) }}
- {{ account.displayName }} + {{ healthLabel(account.health) }} - {{ clientStatusLabel(account) }} + + + {{ clientStatusLabel(account) }} + +
- - - - {{ publishStateLabel(account.publishState) }} - -
@@ -1339,7 +1348,15 @@ function decisionAlertType(result: ComplianceCheckResult | null | undefined) { min-width: 0; } +.publish-modal__account-name-row { + display: flex; + align-items: center; + gap: 8px; + min-width: 0; +} + .publish-modal__identity-copy strong { + min-width: 0; color: #111827; font-size: 15px; font-weight: 600; @@ -1405,6 +1422,13 @@ function decisionAlertType(result: ComplianceCheckResult | null | undefined) { flex-shrink: 0; } +.publish-modal__state-pill--compact { + min-width: 0; + height: 22px; + padding: 0 9px; + font-size: 12px; +} + .publish-modal__state-pill--immediate { background: #ecfdf5; color: #059669; @@ -1434,6 +1458,15 @@ function decisionAlertType(result: ComplianceCheckResult | null | undefined) { border-radius: 4px; } +.publish-modal__client-status-tag { + display: inline-block; + max-width: 118px; + overflow: hidden; + text-overflow: ellipsis; + vertical-align: top; + white-space: nowrap; +} + .publish-modal__cover-body { display: flex; margin-top: 12px; diff --git a/apps/admin-web/src/lib/publish-account-cards.ts b/apps/admin-web/src/lib/publish-account-cards.ts index 74b794f..2fde296 100644 --- a/apps/admin-web/src/lib/publish-account-cards.ts +++ b/apps/admin-web/src/lib/publish-account-cards.ts @@ -194,7 +194,20 @@ export function clientStatusLabel(card: PublishAccountCard): string { if (!card.clientId) { return '未绑定客户端' } - return card.clientOnline ? '客户端在线' : '客户端离线' + + const state = card.clientOnline ? '在线' : '离线' + const deviceName = card.clientDeviceName?.trim() + return deviceName ? `${state} · ${deviceName}` : `客户端${state}` +} + +export function clientStatusTooltip(card: PublishAccountCard): string { + if (!card.clientId) { + return '未绑定桌面客户端' + } + + const state = card.clientOnline ? '在线' : '离线' + const deviceName = card.clientDeviceName?.trim() + return deviceName ? `${state} · ${deviceName}` : `客户端${state}` } export function clientStatusColor(card: PublishAccountCard): string { diff --git a/apps/admin-web/src/views/BrandsView.vue b/apps/admin-web/src/views/BrandsView.vue index 8579519..b29d3a2 100644 --- a/apps/admin-web/src/views/BrandsView.vue +++ b/apps/admin-web/src/views/BrandsView.vue @@ -877,6 +877,7 @@ async function submitCompetitor(): Promise {