fix: Gateway trend bars missing height — now render 48 visible bars

Bars had no `height` property, making them invisible despite the legend
showing correctly. Each bar now computes height proportional to anomaly
count (max 36px), with a 3px minimum for normal intervals.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
enzo
2026-07-22 22:05:55 +08:00
co-authored by Claude
parent c79b1af392
commit ae04ffa9a0
+8
View File
@@ -171,6 +171,10 @@ function barColor(item: GatewayTrendItem): string {
} }
function GatewayTimeline({ trend }: { trend: GatewayTrendItem[] }) { function GatewayTimeline({ trend }: { trend: GatewayTrendItem[] }) {
const maxIssues = Math.max(1, ...trend.map(
i => i.heartbeat_timeouts + i.feishu_disconnects + i.restarts,
))
return ( return (
<div> <div>
<div <div
@@ -184,6 +188,9 @@ function GatewayTimeline({ trend }: { trend: GatewayTrendItem[] }) {
> >
{trend.map((item, i) => { {trend.map((item, i) => {
const col = barColor(item) const col = barColor(item)
const total = item.heartbeat_timeouts + item.feishu_disconnects + item.restarts
const pct = total / maxIssues
const height = total === 0 ? 3 : Math.max(3, Math.round(pct * 36))
const details: string[] = [] const details: string[] = []
if (item.heartbeat_timeouts > 0) details.push('心跳超时 ' + item.heartbeat_timeouts) if (item.heartbeat_timeouts > 0) details.push('心跳超时 ' + item.heartbeat_timeouts)
if (item.feishu_disconnects > 0) details.push('飞书断连 ' + item.feishu_disconnects) if (item.feishu_disconnects > 0) details.push('飞书断连 ' + item.feishu_disconnects)
@@ -195,6 +202,7 @@ function GatewayTimeline({ trend }: { trend: GatewayTrendItem[] }) {
title={item.hour + ': ' + tip} title={item.hour + ': ' + tip}
style={{ style={{
flex: 1, flex: 1,
height,
borderRadius: '2px 2px 0 0', borderRadius: '2px 2px 0 0',
minWidth: 3, minWidth: 3,
cursor: 'pointer', cursor: 'pointer',