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:
@@ -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',
|
||||||
|
|||||||
Reference in New Issue
Block a user