fix: 修复移动端 API 健康页面缺少数据显示

- 移动端添加 URL 地址显示
- 移动端添加状态文本显示(正常/异常/未配置)
- 移动端添加消息/状态信息显示
- 移动端和桌面端显示信息保持一致
This commit is contained in:
WrBug
2025-12-28 05:02:54 +08:00
parent e96a0b6279
commit 23fc20763a
3 changed files with 34 additions and 435 deletions
+34 -14
View File
@@ -98,21 +98,41 @@ const ApiHealthStatus: React.FC = () => {
}}
bodyStyle={{ padding: '12px' }}
>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', flexWrap: 'wrap', gap: '8px' }}>
<Text strong style={{ fontSize: '14px' }}>
{item.name}
</Text>
<Space>
{item.responseTime !== undefined && item.responseTime !== null && (
<Text type="secondary" style={{ fontSize: '12px' }}>
<Text strong style={{ color: '#1890ff' }}>{item.responseTime}ms</Text>
<Space direction="vertical" size="small" style={{ width: '100%' }}>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', flexWrap: 'wrap', gap: '8px' }}>
<Text strong style={{ fontSize: '14px' }}>
{item.name}
</Text>
<Space>
{item.responseTime !== undefined && item.responseTime !== null && (
<Text type="secondary" style={{ fontSize: '12px' }}>
<Text strong style={{ color: '#1890ff' }}>{item.responseTime}ms</Text>
</Text>
)}
<Badge
status={item.status === 'success' ? 'success' : item.status === 'skipped' ? 'default' : 'error'}
text={getStatusText(item.status)}
/>
</Space>
</div>
<div>
<Text type="secondary" style={{ fontSize: '12px', wordBreak: 'break-all' }}>
{item.url}
</Text>
</div>
{item.message && item.message !== '连接成功' && (
<div>
<Text
type={item.status === 'success' ? 'success' : item.status === 'skipped' ? 'secondary' : 'danger'}
style={{ fontSize: '12px' }}
>
{item.message}
</Text>
)}
<Badge
status={item.status === 'success' ? 'success' : item.status === 'skipped' ? 'default' : 'error'}
/>
</Space>
</div>
</div>
)}
</Space>
</Card>
) : (
<Card