mirror of
https://github.com/hamster1963/nezha-dash.git
synced 2025-04-24 21:10:45 +08:00
feat(speed): better network speed readability
This commit is contained in:
parent
f537663892
commit
92497c62f5
@ -7,7 +7,7 @@ import {
|
|||||||
PopoverContent,
|
PopoverContent,
|
||||||
PopoverTrigger,
|
PopoverTrigger,
|
||||||
} from "@/components/ui/popover";
|
} from "@/components/ui/popover";
|
||||||
import { cn, formatNezhaInfo } from "@/lib/utils";
|
import { cn, formatNezhaInfo, formatNetworkSpeed } from "@/lib/utils";
|
||||||
import ServerCardPopover from "./ServerCardPopover";
|
import ServerCardPopover from "./ServerCardPopover";
|
||||||
import getUnicodeFlagIcon from "country-flag-icons/unicode";
|
import getUnicodeFlagIcon from "country-flag-icons/unicode";
|
||||||
import { env } from "next-runtime-env";
|
import { env } from "next-runtime-env";
|
||||||
@ -21,6 +21,9 @@ export default function ServerCard({
|
|||||||
const { name, country_code, online, cpu, up, down, mem, stg, ...props } =
|
const { name, country_code, online, cpu, up, down, mem, stg, ...props } =
|
||||||
formatNezhaInfo(serverInfo);
|
formatNezhaInfo(serverInfo);
|
||||||
|
|
||||||
|
const formattedUpSpeed = formatNetworkSpeed(up);
|
||||||
|
const formattedDownSpeed = formatNetworkSpeed(down);
|
||||||
|
|
||||||
const showFlag = env("NEXT_PUBLIC_ShowFlag") === "true";
|
const showFlag = env("NEXT_PUBLIC_ShowFlag") === "true";
|
||||||
|
|
||||||
return online ? (
|
return online ? (
|
||||||
@ -89,8 +92,8 @@ export default function ServerCard({
|
|||||||
{/* 设置固定宽度 */}
|
{/* 设置固定宽度 */}
|
||||||
<p className="text-xs text-muted-foreground">{t("Upload")}</p>
|
<p className="text-xs text-muted-foreground">{t("Upload")}</p>
|
||||||
<div className="flex items-center text-xs font-semibold">
|
<div className="flex items-center text-xs font-semibold">
|
||||||
{up.toFixed(2)}
|
{formattedUpSpeed.value}
|
||||||
Mb/s
|
{formattedUpSpeed.unit}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={"flex w-14 flex-col"}>
|
<div className={"flex w-14 flex-col"}>
|
||||||
@ -98,8 +101,8 @@ export default function ServerCard({
|
|||||||
{/* 设置固定宽度 */}
|
{/* 设置固定宽度 */}
|
||||||
<p className="text-xs text-muted-foreground">{t("Download")}</p>
|
<p className="text-xs text-muted-foreground">{t("Download")}</p>
|
||||||
<div className="flex items-center text-xs font-semibold">
|
<div className="flex items-center text-xs font-semibold">
|
||||||
{down.toFixed(2)}
|
{formattedDownSpeed.value}
|
||||||
Mb/s
|
{formattedDownSpeed.unit}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
25
lib/utils.ts
25
lib/utils.ts
@ -10,8 +10,8 @@ export function formatNezhaInfo(serverInfo: NezhaAPISafe) {
|
|||||||
return {
|
return {
|
||||||
...serverInfo,
|
...serverInfo,
|
||||||
cpu: serverInfo.status.CPU,
|
cpu: serverInfo.status.CPU,
|
||||||
up: serverInfo.status.NetOutSpeed / 1024 / 1024,
|
up: serverInfo.status.NetOutSpeed,
|
||||||
down: serverInfo.status.NetInSpeed / 1024 / 1024,
|
down: serverInfo.status.NetInSpeed,
|
||||||
online: serverInfo.online_status,
|
online: serverInfo.online_status,
|
||||||
mem: (serverInfo.status.MemUsed / serverInfo.host.MemTotal) * 100,
|
mem: (serverInfo.status.MemUsed / serverInfo.host.MemTotal) * 100,
|
||||||
stg: (serverInfo.status.DiskUsed / serverInfo.host.DiskTotal) * 100,
|
stg: (serverInfo.status.DiskUsed / serverInfo.host.DiskTotal) * 100,
|
||||||
@ -19,6 +19,27 @@ export function formatNezhaInfo(serverInfo: NezhaAPISafe) {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface FormattedSpeed {
|
||||||
|
value: number;
|
||||||
|
unit: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function formatNetworkSpeed(bytesPerSecond: number): FormattedSpeed {
|
||||||
|
const units = ['B/s', 'KB/s', 'MB/s', 'GB/s', 'TB/s'];
|
||||||
|
let speed = bytesPerSecond;
|
||||||
|
let unitIndex = 0;
|
||||||
|
|
||||||
|
while (speed >= 1024 && unitIndex < units.length - 1) {
|
||||||
|
speed /= 1024;
|
||||||
|
unitIndex++;
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
value: parseFloat(speed.toFixed(2)),
|
||||||
|
unit: units[unitIndex]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
export function formatBytes(bytes: number, decimals: number = 2) {
|
export function formatBytes(bytes: number, decimals: number = 2) {
|
||||||
if (!+bytes) return "0 Bytes";
|
if (!+bytes) return "0 Bytes";
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user