hansjone/netx
1
0
Fork 0
mirror of https://github.com/hansjone/netx.git synced 2026-10-09 02:00:46 +08:00
Code Issues Projects Releases 1 Packages Wiki Activity Actions 2

Show baseline device and interface under the port traffic wall chart.

Browse source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
oliver 2026-08-01 09:38:20 +08:00
parent 5e940252e6
commit e4a365fa16
4 changed files with 29 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/src/i18n/en.ts
View file

@ -114,6 +114,8 @@ const en = {
offsetHours: "Offset (hours)",
baseline: "Baseline",
baselineAt: "Baseline time",
baselineDevice: "Baseline device",
baselinePort: "Baseline interface",
seriesCurrentIn: "Current In",
seriesCurrentOut: "Current Out",
seriesBaselineIn: "Baseline In",

2
web/src/i18n/zh.ts
View file

@ -114,6 +114,8 @@ const zh = {
offsetHours: "偏移（小时）",
baseline: "基线",
baselineAt: "基线原时刻",
baselineDevice: "基线网元",
baselinePort: "基线接口",
seriesCurrentIn: "当前 In",
seriesCurrentOut: "当前 Out",
seriesBaselineIn: "基线 In",

4
web/src/pages/network/PortTrafficPage.tsx
View file

@ -796,6 +796,10 @@ export function PortTrafficPage() {
) : null}
<PortTrafficWall
target={selectedWallTarget}
baselineTarget={
compareQuery.data?.meta?.baseline_target ||
(baseline !== "off" && wallBaselinePoints.length ? selectedWallTarget : null)
}
points={wallPoints}
baselinePoints={wallBaselinePoints}
rangeLabel={`${rangeHours}h${

21
web/src/pages/network/PortTrafficWall.tsx
View file

@ -69,6 +69,7 @@ const EMPTY_POINTS: PortTrafficSamplePoint[] = [];
type Props = {
target: PortTrafficTarget | null;
baselineTarget?: PortTrafficTarget | null;
points: PortTrafficSamplePoint[];
baselinePoints?: PortTrafficSamplePoint[];
rangeLabel: string;
@ -78,6 +79,7 @@ type Props = {
export function PortTrafficWall({
target,
baselineTarget = null,
points,
baselinePoints = EMPTY_POINTS,
rangeLabel,
@ -314,6 +316,12 @@ export function PortTrafficWall({
const neLabel = target ? target.ne_name || target.ne_ip || "—" : "—";
const ifLabel = target?.ifname || "—";
const ipLabel = target?.ne_ip || "";
const showBaselineMeta = Boolean(baselineTarget) && baselinePoints.length > 0;
const baseNeLabel = baselineTarget
? baselineTarget.ne_name || baselineTarget.ne_ip || "—"
: "—";
const baseIfLabel = baselineTarget?.ifname || "—";
const baseIpLabel = baselineTarget?.ne_ip || "";
return (
<div className="pt-wall">
@ -379,6 +387,19 @@ export function PortTrafficWall({
<span className="pt-wall__foot-label">{t("portTraffic.wallPort")}</span>
<span className="pt-wall__foot-value pt-wall__foot-value--mono">{ifLabel}</span>
</div>
{showBaselineMeta ? (
<>
<div className="pt-wall__foot-ne" title={baseNeLabel}>
<span className="pt-wall__foot-label">{t("portTraffic.baselineDevice")}</span>
<span className="pt-wall__foot-value">{baseNeLabel}</span>
{baseIpLabel ? <span className="pt-wall__foot-ip">{baseIpLabel}</span> : null}
</div>
<div className="pt-wall__foot-if" title={baseIfLabel}>
<span className="pt-wall__foot-label">{t("portTraffic.baselinePort")}</span>
<span className="pt-wall__foot-value pt-wall__foot-value--mono">{baseIfLabel}</span>
</div>
</>
) : null}
</div>
</div>
);