wood/nezha-dash-v1
1
0
Fork 0
mirror of https://github.com/woodchen-ink/nezha-dash-v1.git synced 2025-07-18 09:31:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: server list sort

Browse Source
This commit is contained in:
hamster1963 2024-12-15 23:31:28 +08:00
parent 6e9f1f11af
commit cbbd69bbc7
2 changed files with 46 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/context/sort-context.ts
View File

@ -1,11 +1,12 @@
import { createContext } from "react"
export type SortType = "default" | "cpu" | "mem" | "up" | "down" | "up total" | "down total"
export type SortType = "default" | "cpu" | "mem" | "stg" | "up" | "down" | "up total" | "down total"
export const SORT_TYPES: SortType[] = [
"default",
"cpu",
"mem",
"stg",
"up",
"down",
"up total",
@ -14,8 +15,7 @@ export const SORT_TYPES: SortType[] = [
export type SortOrder = "asc" | "desc"
export const SORT_ORDERS: SortOrder[] = [ "desc","asc"]
export const SORT_ORDERS: SortOrder[] = ["desc", "asc"]
export interface SortContextType {
sortType: SortType

46
src/pages/Server.tsx
View File

@ -7,7 +7,7 @@ import { ServiceTracker } from "@/components/ServiceTracker"
import { Loader } from "@/components/loading/Loader"
import { Label } from "@/components/ui/label"
import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
import { forEachSortType, SORT_ORDERS, SORT_TYPES } from "@/context/sort-context"
import { SORT_ORDERS, SORT_TYPES } from "@/context/sort-context"
import { useSort } from "@/hooks/use-sort"
import { useStatus } from "@/hooks/use-status"
import { useWebSocketContext } from "@/hooks/use-websocket-context"
@ -23,7 +23,7 @@ import { toast } from "sonner"
export default function Servers() {
const { t } = useTranslation()
const { sortType,sortOrder,setSortOrder,setSortType } = useSort()
const { sortType, sortOrder, setSortOrder, setSortType } = useSort()
const { data: groupData } = useQuery({
queryKey: ["server-group"],
queryFn: () => fetchServerGroup(),
@ -140,6 +140,45 @@ export default function Servers() {
[status].includes(formatNezhaInfo(nezhaWsData.now, server).online ? "online" : "offline"),
)
filteredServers = filteredServers.sort((a, b) => {
const serverAInfo = formatNezhaInfo(nezhaWsData.now, a)
const serverBInfo = formatNezhaInfo(nezhaWsData.now, b)
if (!serverAInfo.online && serverBInfo.online) return 1
if (serverAInfo.online && !serverBInfo.online) return -1
if (!serverAInfo.online && !serverBInfo.online) return 0
let comparison = 0
switch (sortType) {
case "cpu":
comparison = (a.state?.cpu ?? 0) - (b.state?.cpu ?? 0)
break
case "mem":
comparison = (a.state?.mem_used ?? 0) - (b.state?.mem_used ?? 0)
break
case "stg":
comparison = (a.state?.disk_used ?? 0) - (b.state?.disk_used ?? 0)
break
case "up":
comparison = (a.state?.net_out_speed ?? 0) - (b.state?.net_out_speed ?? 0)
break
case "down":
comparison = (a.state?.net_in_speed ?? 0) - (b.state?.net_in_speed ?? 0)
break
case "up total":
comparison = (a.state?.net_out_transfer ?? 0) - (b.state?.net_out_transfer ?? 0)
break
case "down total":
comparison = (a.state?.net_in_transfer ?? 0) - (b.state?.net_in_transfer ?? 0)
break
default:
comparison = 0
}
return sortOrder === "asc" ? comparison : -comparison
})
return (
<div className="mx-auto w-full max-w-5xl px-0">
<ServerOverview
@ -235,12 +274,13 @@ export default function Servers() {
<section className="flex items-center gap-1">
{SORT_ORDERS.map((order) => (
<button
disabled={sortType === "default"}
key={order}
onClick={() => setSortOrder(order)}
className={cn(
"rounded-[5px] text-[11px] w-fit px-1 py-0.5 cursor-pointer bg-transparent border transition-all shadow-[inset_0_1px_0_rgba(255,255,255,0.2)] ",
{
"bg-black text-white": sortOrder === order,
"bg-black text-white": sortOrder === order && sortType !== "default",
},
)}
>