Compare commits
3
Commits
8c13af680a
...
patch-1
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
beb826e7d6
|
||
|
|
f2dae09b6b
|
||
|
|
885a0c2d89
|
@@ -0,0 +1,39 @@
|
|||||||
|
name: Build Dashboard
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
build:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- name: Check out source
|
||||||
|
uses: actions/checkout@v4
|
||||||
|
|
||||||
|
- name: Set up pnpm
|
||||||
|
uses: pnpm/action-setup@v4
|
||||||
|
with:
|
||||||
|
version: 11
|
||||||
|
|
||||||
|
- name: Set up Node.js
|
||||||
|
uses: actions/setup-node@v4
|
||||||
|
with:
|
||||||
|
node-version: 24
|
||||||
|
cache: pnpm
|
||||||
|
cache-dependency-path: pnpm-lock.yaml
|
||||||
|
|
||||||
|
- name: Install dependencies
|
||||||
|
run: pnpm install --frozen-lockfile
|
||||||
|
|
||||||
|
- name: Build dashboard
|
||||||
|
run: pnpm build
|
||||||
|
|
||||||
|
- name: Upload dashboard artifact
|
||||||
|
uses: actions/upload-artifact@v4
|
||||||
|
env:
|
||||||
|
ACTIONS_RESULTS_URL: https://git.code.cq.cn/
|
||||||
|
with:
|
||||||
|
name: dashboard-dist
|
||||||
|
path: dist/
|
||||||
|
if-no-files-found: error
|
||||||
|
retention-days: 14
|
||||||
+30
-33
@@ -20,42 +20,37 @@ import {
|
|||||||
import { useRoutingTable } from "@/hooks/use-routing-table"
|
import { useRoutingTable } from "@/hooks/use-routing-table"
|
||||||
import type { RoutingTableItem } from "@/types/api"
|
import type { RoutingTableItem } from "@/types/api"
|
||||||
|
|
||||||
type ProtocolFilter = "all" | "direct" | "klalb"
|
type ProtocolFilter = "all" | string
|
||||||
|
|
||||||
function protocolName(protocol: RoutingTableItem["protocol"]): string {
|
|
||||||
const value = String(protocol)
|
|
||||||
const normalized = value.toLowerCase()
|
|
||||||
if (normalized === "direct" || value === "0") return "Direct"
|
|
||||||
if (
|
|
||||||
normalized.includes("klalb") ||
|
|
||||||
normalized.includes("srv6") ||
|
|
||||||
value === "1"
|
|
||||||
)
|
|
||||||
return "KLALB SRv6"
|
|
||||||
return value
|
|
||||||
}
|
|
||||||
|
|
||||||
function protocolBadge(protocol: RoutingTableItem["protocol"]) {
|
function protocolBadge(protocol: RoutingTableItem["protocol"]) {
|
||||||
const name = protocolName(protocol)
|
if (protocol === "Direct")
|
||||||
if (name === "Direct")
|
|
||||||
return (
|
return (
|
||||||
<Badge
|
<Badge
|
||||||
variant="secondary"
|
variant="secondary"
|
||||||
className="bg-blue-500/10 text-blue-600 dark:text-blue-400"
|
className="bg-blue-500/10 text-blue-600 dark:text-blue-400"
|
||||||
>
|
>
|
||||||
{name}
|
{protocol}
|
||||||
</Badge>
|
</Badge>
|
||||||
)
|
)
|
||||||
if (name === "KLALB SRv6")
|
if (protocol === "SRv6 ENDXSID")
|
||||||
return (
|
return (
|
||||||
<Badge
|
<Badge
|
||||||
variant="secondary"
|
variant="secondary"
|
||||||
className="bg-purple-500/10 text-purple-600 dark:text-purple-400"
|
className="bg-purple-500/10 text-purple-600 dark:text-purple-400"
|
||||||
>
|
>
|
||||||
{name}
|
{protocol}
|
||||||
</Badge>
|
</Badge>
|
||||||
)
|
)
|
||||||
return <Badge variant="outline">{name}</Badge>
|
if (protocol === "SRv6 ENDSID")
|
||||||
|
return (
|
||||||
|
<Badge
|
||||||
|
variant="secondary"
|
||||||
|
className="bg-emerald-500/10 text-emerald-600 dark:text-emerald-400"
|
||||||
|
>
|
||||||
|
{protocol}
|
||||||
|
</Badge>
|
||||||
|
)
|
||||||
|
return <Badge variant="outline">{protocol}</Badge>
|
||||||
}
|
}
|
||||||
|
|
||||||
export function RoutingTablePage() {
|
export function RoutingTablePage() {
|
||||||
@@ -67,12 +62,9 @@ export function RoutingTablePage() {
|
|||||||
const counts = useMemo(
|
const counts = useMemo(
|
||||||
() => ({
|
() => ({
|
||||||
total: routingTable.length,
|
total: routingTable.length,
|
||||||
direct: routingTable.filter(
|
direct: routingTable.filter((route) => route.protocol === "Direct").length,
|
||||||
(route) => protocolName(route.protocol) === "Direct"
|
endxsid: routingTable.filter((route) => route.protocol === "SRv6 ENDXSID").length,
|
||||||
).length,
|
endsid: routingTable.filter((route) => route.protocol === "SRv6 ENDSID").length,
|
||||||
klalb: routingTable.filter(
|
|
||||||
(route) => protocolName(route.protocol) === "KLALB SRv6"
|
|
||||||
).length,
|
|
||||||
}),
|
}),
|
||||||
[routingTable]
|
[routingTable]
|
||||||
)
|
)
|
||||||
@@ -86,13 +78,11 @@ export function RoutingTablePage() {
|
|||||||
route.destination,
|
route.destination,
|
||||||
route.nexthop,
|
route.nexthop,
|
||||||
route.interface,
|
route.interface,
|
||||||
protocolName(route.protocol),
|
route.protocol,
|
||||||
].some((value) => String(value).toLowerCase().includes(query))
|
].some((value) => String(value).toLowerCase().includes(query))
|
||||||
const name = protocolName(route.protocol)
|
|
||||||
const matchesProtocol =
|
const matchesProtocol =
|
||||||
protocolFilter === "all" ||
|
protocolFilter === "all" ||
|
||||||
(protocolFilter === "direct" && name === "Direct") ||
|
route.protocol === protocolFilter
|
||||||
(protocolFilter === "klalb" && name === "KLALB SRv6")
|
|
||||||
return matchesSearch && matchesProtocol
|
return matchesSearch && matchesProtocol
|
||||||
})
|
})
|
||||||
}, [routingTable, searchQuery, protocolFilter])
|
}, [routingTable, searchQuery, protocolFilter])
|
||||||
@@ -112,8 +102,9 @@ export function RoutingTablePage() {
|
|||||||
|
|
||||||
const filterOptions: { value: ProtocolFilter; label: string }[] = [
|
const filterOptions: { value: ProtocolFilter; label: string }[] = [
|
||||||
{ value: "all", label: "全部" },
|
{ value: "all", label: "全部" },
|
||||||
{ value: "direct", label: "直连" },
|
...Array.from(new Set(routingTable.map((route) => route.protocol))).map(
|
||||||
{ value: "klalb", label: "KLALB SRv6" },
|
(protocol) => ({ value: protocol, label: protocol })
|
||||||
|
),
|
||||||
]
|
]
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -142,7 +133,13 @@ export function RoutingTablePage() {
|
|||||||
variant="secondary"
|
variant="secondary"
|
||||||
className="bg-purple-500/10 text-purple-600 dark:text-purple-400"
|
className="bg-purple-500/10 text-purple-600 dark:text-purple-400"
|
||||||
>
|
>
|
||||||
KLALB SRv6 {counts.klalb}
|
SRv6 ENDXSID {counts.endxsid}
|
||||||
|
</Badge>
|
||||||
|
<Badge
|
||||||
|
variant="secondary"
|
||||||
|
className="bg-emerald-500/10 text-emerald-600 dark:text-emerald-400"
|
||||||
|
>
|
||||||
|
SRv6 ENDSID {counts.endsid}
|
||||||
</Badge>
|
</Badge>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
+2
-2
@@ -66,10 +66,10 @@ export interface SSEEventData {
|
|||||||
|
|
||||||
export interface RoutingTableItem {
|
export interface RoutingTableItem {
|
||||||
destination: string
|
destination: string
|
||||||
protocol: number
|
protocol: string
|
||||||
preference: number
|
preference: number
|
||||||
cost: number
|
cost: number
|
||||||
flag: number
|
flag: string
|
||||||
nexthop: string
|
nexthop: string
|
||||||
interface: string
|
interface: string
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user