mirror of
https://github.com/hansjone/netx.git
synced 2026-10-09 03:10:46 +08:00
Add industrial config sync separate from collection tasks.
Periodic vendor-aware CLI sync stores zlib snapshots in Postgres with dashboard, retry, and config viewer under Network Management. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
parent
2fc47e5135
commit
0eead0e662
23 changed files with 2993 additions and 9 deletions
14
web/WEB.md
14
web/WEB.md
|
|
@ -37,11 +37,13 @@ src/
|
|||
| `/network/devices` | 设备列表 | `network` |
|
||||
| `/network/topology` | 拓扑信息 | `network` |
|
||||
| `/network/alarms` | 告警信息 | `network` |
|
||||
| `/network/configs` | 配置信息(同步快照) | `network` |
|
||||
| `/network/webcrt` | WebCRT 终端 | `network` |
|
||||
| `/network/tasks/config-sync` | 采集任务(原批量采集) | `network` |
|
||||
| `/network/tasks/collect` | 采集任务 | `network` |
|
||||
| `/network/tasks/config-sync` | 配置同步 | `network` |
|
||||
| `/network/tasks/port-traffic` | 端口流量(占位) | `network` |
|
||||
| `/ne` | redirect → `/network/devices` | — |
|
||||
| `/collect` | redirect → `/network/tasks/config-sync` | — |
|
||||
| `/collect` | redirect → `/network/tasks/collect` | — |
|
||||
| `/topology` | redirect → `/network/topology` | — |
|
||||
| `/webcrt` | redirect → `/network/webcrt`(保留 query) | — |
|
||||
|
||||
|
|
@ -90,6 +92,14 @@ src/
|
|||
- 采集日志目录:`NETX_NE_COLLECTION_DATA_DIR`(默认 `data/ne_collections`)
|
||||
- 命令每行一条,`#` 为注释;输出格式与旧版 NetX 采集 `.txt` 一致
|
||||
|
||||
## 配置同步
|
||||
|
||||
- API:`/v1/config-sync/*`(策略、看板、周期、快照)
|
||||
- 存储:PostgreSQL `ne_config_snapshot` / `ne_config_history`(zlib BYTEA)
|
||||
- 范围:ManagedNE + UME CLI 目标;厂商固定只读命令矩阵
|
||||
- 调度:`NETX_CONFIG_SYNC_SCHEDULER_ENABLED`(默认开),周期天数策略可配(默认 3 天)
|
||||
- 前端:`/network/tasks/config-sync`(看板)+ `/network/configs`(查看)
|
||||
|
||||
## WebCRT
|
||||
|
||||
- API:`POST /v1/webcrt/sessions`(`ne_id` 或 `ume_ne_id`)、`WS /v1/webcrt/sessions/{id}/ws`、`DELETE /v1/webcrt/sessions/{id}`
|
||||
|
|
|
|||
|
|
@ -4,12 +4,14 @@ import { AppLayout } from "./layout/AppLayout";
|
|||
import { queryKeys } from "./constants/queryKeys";
|
||||
import { WorkbenchPage } from "./pages/WorkbenchPage";
|
||||
import { CollectPage } from "./pages/CollectPage";
|
||||
import { ConfigSyncPage } from "./pages/ConfigSyncPage";
|
||||
import { NePage } from "./pages/NePage";
|
||||
import { UmePage } from "./pages/UmePage";
|
||||
import { WebcrtPage } from "./pages/WebcrtPage";
|
||||
import { TopologyPage } from "./pages/TopologyPage";
|
||||
import { NetworkLayout } from "./pages/network/NetworkLayout";
|
||||
import { NetworkAlarmsPage } from "./pages/network/NetworkAlarmsPage";
|
||||
import { NetworkConfigsPage } from "./pages/network/NetworkConfigsPage";
|
||||
import { NetworkPlaceholderPage } from "./pages/network/NetworkPlaceholderPage";
|
||||
import { LoginPage } from "./pages/LoginPage";
|
||||
import { UsersPage } from "./pages/UsersPage";
|
||||
|
|
@ -85,12 +87,14 @@ function ProtectedApp() {
|
|||
<Route path="devices" element={<NePage />} />
|
||||
<Route path="topology" element={<TopologyPage />} />
|
||||
<Route path="alarms" element={<NetworkAlarmsPage />} />
|
||||
<Route path="configs" element={<NetworkConfigsPage />} />
|
||||
<Route path="webcrt" element={<WebcrtPage />} />
|
||||
<Route path="tasks/config-sync" element={<CollectPage />} />
|
||||
<Route path="tasks/collect" element={<CollectPage />} />
|
||||
<Route path="tasks/config-sync" element={<ConfigSyncPage />} />
|
||||
<Route path="tasks/port-traffic" element={<NetworkPlaceholderPage kind="port-traffic" />} />
|
||||
</Route>
|
||||
<Route path="/ne" element={<Navigate to="/network/devices" replace />} />
|
||||
<Route path="/collect" element={<Navigate to="/network/tasks/config-sync" replace />} />
|
||||
<Route path="/collect" element={<Navigate to="/network/tasks/collect" replace />} />
|
||||
<Route path="/topology" element={<Navigate to="/network/topology" replace />} />
|
||||
<Route path="/webcrt" element={<WebcrtLegacyRedirect />} />
|
||||
<Route path="/users" element={<UsersPage />} />
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@ export const NETWORK_NAV: readonly NetworkNavGroup[] = [
|
|||
{ id: "devices", path: "/network/devices", labelKey: "network.nav.devices", group: "detail" },
|
||||
{ id: "topology", path: "/network/topology", labelKey: "network.nav.topology", group: "detail" },
|
||||
{ id: "alarms", path: "/network/alarms", labelKey: "network.nav.alarms", group: "detail" },
|
||||
{ id: "configs", path: "/network/configs", labelKey: "network.nav.configs", group: "detail" },
|
||||
{ id: "webcrt", path: "/network/webcrt", labelKey: "network.nav.webcrt", group: "detail" },
|
||||
],
|
||||
},
|
||||
|
|
@ -33,6 +34,12 @@ export const NETWORK_NAV: readonly NetworkNavGroup[] = [
|
|||
id: "tasks",
|
||||
labelKey: "network.nav.tasks",
|
||||
items: [
|
||||
{
|
||||
id: "collect",
|
||||
path: "/network/tasks/collect",
|
||||
labelKey: "network.nav.collectTasks",
|
||||
group: "tasks",
|
||||
},
|
||||
{
|
||||
id: "config-sync",
|
||||
path: "/network/tasks/config-sync",
|
||||
|
|
|
|||
|
|
@ -48,4 +48,15 @@ export const queryKeys = {
|
|||
) => ["umeCurrentAlarms", severity, cleared, hostName, keyword, page, pageSize] as const,
|
||||
topologyMaps: ["topologyMaps"] as const,
|
||||
topologyGraph: (mapId: string) => ["topologyGraph", mapId] as const,
|
||||
configSyncDashboard: ["configSyncDashboard"] as const,
|
||||
configSyncPolicy: ["configSyncPolicy"] as const,
|
||||
configSyncCyclesAll: ["configSyncCycles"] as const,
|
||||
configSyncCycles: (page: number) => ["configSyncCycles", page] as const,
|
||||
configSyncCycleTasksAll: ["configSyncCycleTasks"] as const,
|
||||
configSyncCycleTasks: (cycleId: string, page: number, status: string, keyword: string) =>
|
||||
["configSyncCycleTasks", cycleId, page, status, keyword] as const,
|
||||
networkConfigsAll: ["networkConfigs"] as const,
|
||||
networkConfigs: (page: number, keyword: string, source: string, vendor: string) =>
|
||||
["networkConfigs", page, keyword, source, vendor] as const,
|
||||
networkConfigDetail: (source: string, id: string) => ["networkConfigDetail", source, id] as const,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -49,8 +49,10 @@ const en = {
|
|||
devices: "Device list",
|
||||
topology: "Topology",
|
||||
alarms: "Alarms",
|
||||
configs: "Configurations",
|
||||
webcrt: "WebCRT",
|
||||
configSync: "Collection tasks",
|
||||
collectTasks: "Collection tasks",
|
||||
configSync: "Config sync",
|
||||
portTraffic: "Port traffic",
|
||||
},
|
||||
placeholder: {
|
||||
|
|
@ -64,6 +66,71 @@ const en = {
|
|||
portTrafficStep4: "UI: task list + per-port trend charts",
|
||||
},
|
||||
},
|
||||
configSync: {
|
||||
title: "Config sync",
|
||||
syncNow: "Sync now",
|
||||
retryFailed: "Retry failed",
|
||||
pause: "Pause",
|
||||
resume: "Resume",
|
||||
started: "Sync cycle started",
|
||||
paused: "Paused",
|
||||
resumed: "Resumed",
|
||||
policyTitle: "Sync policy",
|
||||
policySaved: "Policy saved",
|
||||
enabled: "Enable scheduled sync",
|
||||
intervalDays: "Interval (days)",
|
||||
concurrency: "Concurrency",
|
||||
historyKeep: "History keep",
|
||||
scope: "Scope",
|
||||
scopeAll: "All NEs",
|
||||
scopeSelected: "Selected NEs",
|
||||
savePolicy: "Save policy",
|
||||
selectedCount: "{{count}} selected",
|
||||
targetKeywordPh: "Name / IP / vendor",
|
||||
cyclesTitle: "Sync cycles",
|
||||
cyclesEmpty: "No sync cycles yet",
|
||||
tasksTitle: "Cycle tasks",
|
||||
taskKeywordPh: "Name / IP / message",
|
||||
allStatus: "All statuses",
|
||||
expand: "Expand",
|
||||
collapse: "Collapse",
|
||||
kpi: {
|
||||
snapshots: "Snapshots",
|
||||
running: "In progress",
|
||||
idle: "Idle",
|
||||
last: "Last cycle",
|
||||
nextDue: "Next due",
|
||||
},
|
||||
col: {
|
||||
source: "Source",
|
||||
name: "Device",
|
||||
vendor: "Vendor",
|
||||
trigger: "Trigger",
|
||||
status: "Status",
|
||||
progress: "Progress",
|
||||
started: "Started",
|
||||
ended: "Ended",
|
||||
message: "Message",
|
||||
},
|
||||
},
|
||||
networkConfigs: {
|
||||
title: "Configurations",
|
||||
keywordPh: "Name / IP / ID",
|
||||
vendorPh: "Vendor",
|
||||
allSource: "All sources",
|
||||
empty: "No synced configs yet. Run Config sync first.",
|
||||
view: "View",
|
||||
close: "Close",
|
||||
tabSet: "Set format",
|
||||
tabHier: "Hierarchical",
|
||||
col: {
|
||||
name: "Device",
|
||||
vendor: "Vendor",
|
||||
source: "Source",
|
||||
size: "Size",
|
||||
collected: "Collected",
|
||||
},
|
||||
},
|
||||
layout: {
|
||||
title: "UME Integration",
|
||||
titleUme: "UME Sync",
|
||||
|
|
|
|||
|
|
@ -49,8 +49,10 @@ const zh = {
|
|||
devices: "设备列表",
|
||||
topology: "拓扑信息",
|
||||
alarms: "告警信息",
|
||||
configs: "配置信息",
|
||||
webcrt: "WebCRT",
|
||||
configSync: "采集任务",
|
||||
collectTasks: "采集任务",
|
||||
configSync: "配置同步",
|
||||
portTraffic: "端口流量监控",
|
||||
},
|
||||
placeholder: {
|
||||
|
|
@ -64,6 +66,71 @@ const zh = {
|
|||
portTrafficStep4: "界面:任务列表 + 单端口趋势图",
|
||||
},
|
||||
},
|
||||
configSync: {
|
||||
title: "配置同步",
|
||||
syncNow: "立即全量同步",
|
||||
retryFailed: "一键重试失败",
|
||||
pause: "暂停",
|
||||
resume: "继续",
|
||||
started: "已启动同步周期",
|
||||
paused: "已暂停",
|
||||
resumed: "已继续",
|
||||
policyTitle: "同步策略",
|
||||
policySaved: "策略已保存",
|
||||
enabled: "启用周期调度",
|
||||
intervalDays: "周期(天)",
|
||||
concurrency: "并发",
|
||||
historyKeep: "历史保留",
|
||||
scope: "范围",
|
||||
scopeAll: "全部网元",
|
||||
scopeSelected: "指定网元",
|
||||
savePolicy: "保存策略",
|
||||
selectedCount: "已选 {{count}} 台",
|
||||
targetKeywordPh: "名称 / IP / 厂商",
|
||||
cyclesTitle: "同步周期",
|
||||
cyclesEmpty: "暂无同步周期",
|
||||
tasksTitle: "周期任务",
|
||||
taskKeywordPh: "名称 / IP / 消息",
|
||||
allStatus: "全部状态",
|
||||
expand: "展开",
|
||||
collapse: "收起",
|
||||
kpi: {
|
||||
snapshots: "配置覆盖数",
|
||||
running: "进行中",
|
||||
idle: "空闲",
|
||||
last: "最近一轮",
|
||||
nextDue: "下次调度",
|
||||
},
|
||||
col: {
|
||||
source: "来源",
|
||||
name: "设备",
|
||||
vendor: "厂商",
|
||||
trigger: "触发",
|
||||
status: "状态",
|
||||
progress: "进度",
|
||||
started: "开始",
|
||||
ended: "结束",
|
||||
message: "消息",
|
||||
},
|
||||
},
|
||||
networkConfigs: {
|
||||
title: "配置信息",
|
||||
keywordPh: "名称 / IP / ID",
|
||||
vendorPh: "厂商",
|
||||
allSource: "全部来源",
|
||||
empty: "暂无已同步配置。请先在「配置同步」执行采集。",
|
||||
view: "查看",
|
||||
close: "关闭",
|
||||
tabSet: "Set 格式",
|
||||
tabHier: "层级格式",
|
||||
col: {
|
||||
name: "设备",
|
||||
vendor: "厂商",
|
||||
source: "来源",
|
||||
size: "大小",
|
||||
collected: "采集时间",
|
||||
},
|
||||
},
|
||||
layout: {
|
||||
title: "UME 对接",
|
||||
titleUme: "UME同步",
|
||||
|
|
|
|||
|
|
@ -758,7 +758,46 @@ pre {
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
/* ── NE stats card ── */
|
||||
.stat-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
border: 1px solid var(--border, #e2e8f0);
|
||||
border-radius: 8px;
|
||||
padding: 12px 14px;
|
||||
background: var(--panel-bg, #fff);
|
||||
}
|
||||
|
||||
.stat-card strong {
|
||||
display: block;
|
||||
margin-top: 4px;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.btn-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #2563eb;
|
||||
color: #fff;
|
||||
border-color: #1d4ed8;
|
||||
}
|
||||
|
||||
.btn-primary:disabled {
|
||||
opacity: 0.55;
|
||||
}
|
||||
|
||||
.data-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ne-stats-card {
|
||||
padding: 12px 14px;
|
||||
}
|
||||
|
|
|
|||
496
web/src/pages/ConfigSyncPage.tsx
Normal file
496
web/src/pages/ConfigSyncPage.tsx
Normal file
|
|
@ -0,0 +1,496 @@
|
|||
import { useEffect, useMemo, useState } from "react";
|
||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||
import {
|
||||
createConfigSyncCycle,
|
||||
fetchCliTargets,
|
||||
fetchConfigSyncCycleTasks,
|
||||
fetchConfigSyncCycles,
|
||||
fetchConfigSyncDashboard,
|
||||
pauseConfigSyncCycle,
|
||||
resumeConfigSyncCycle,
|
||||
updateConfigSyncPolicy,
|
||||
} from "../services/api";
|
||||
import { queryKeys } from "../constants/queryKeys";
|
||||
import { useI18n } from "../i18n";
|
||||
import { useToast } from "../hooks/useToast";
|
||||
import type { CliTargetItem, ConfigSyncTargetRef } from "../types";
|
||||
import { pageCount } from "../utils/display";
|
||||
import { formatSystemTime } from "../utils/time";
|
||||
|
||||
const POLL_MS = 2500;
|
||||
const TARGET_PAGE_SIZE = 20;
|
||||
|
||||
export function ConfigSyncPage() {
|
||||
const { t } = useI18n();
|
||||
const { showOk, showError } = useToast();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const [cyclePage, setCyclePage] = useState(1);
|
||||
const [expandedCycleId, setExpandedCycleId] = useState("");
|
||||
const [taskPage, setTaskPage] = useState(1);
|
||||
const [taskStatus, setTaskStatus] = useState("");
|
||||
const [taskKeyword, setTaskKeyword] = useState("");
|
||||
|
||||
const [enabled, setEnabled] = useState(true);
|
||||
const [intervalDays, setIntervalDays] = useState(3);
|
||||
const [concurrency, setConcurrency] = useState(5);
|
||||
const [scopeMode, setScopeMode] = useState<"all" | "selected">("all");
|
||||
const [historyKeep, setHistoryKeep] = useState(3);
|
||||
const [selectedMap, setSelectedMap] = useState<Record<string, ConfigSyncTargetRef>>({});
|
||||
const [policyHydrated, setPolicyHydrated] = useState(false);
|
||||
|
||||
const [targetKeyword, setTargetKeyword] = useState("");
|
||||
const [targetPage, setTargetPage] = useState(1);
|
||||
|
||||
const dashQuery = useQuery({
|
||||
queryKey: queryKeys.configSyncDashboard,
|
||||
queryFn: fetchConfigSyncDashboard,
|
||||
staleTime: 1000,
|
||||
refetchInterval: (q) => {
|
||||
const running = q.state.data?.running_cycle;
|
||||
return running && (running.status === "running" || running.status === "paused") ? POLL_MS : false;
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (!dashQuery.data || policyHydrated) return;
|
||||
const p = dashQuery.data.policy;
|
||||
setEnabled(Boolean(p.enabled));
|
||||
setIntervalDays(Number(p.interval_days || 3));
|
||||
setConcurrency(Number(p.concurrency || 5));
|
||||
setScopeMode(p.scope_mode === "selected" ? "selected" : "all");
|
||||
setHistoryKeep(Number(p.history_keep ?? 3));
|
||||
const map: Record<string, ConfigSyncTargetRef> = {};
|
||||
for (const ref of p.selected_targets || []) {
|
||||
map[`${ref.source}:${ref.id}`] = { source: ref.source, id: ref.id };
|
||||
}
|
||||
setSelectedMap(map);
|
||||
setPolicyHydrated(true);
|
||||
}, [dashQuery.data, policyHydrated]);
|
||||
|
||||
const cyclesQuery = useQuery({
|
||||
queryKey: queryKeys.configSyncCycles(cyclePage),
|
||||
queryFn: () => fetchConfigSyncCycles({ page: cyclePage, pageSize: 10 }),
|
||||
staleTime: 1000,
|
||||
refetchInterval: () => (dashQuery.data?.running_cycle ? POLL_MS : false),
|
||||
});
|
||||
|
||||
const tasksQuery = useQuery({
|
||||
queryKey: queryKeys.configSyncCycleTasks(expandedCycleId, taskPage, taskStatus, taskKeyword),
|
||||
queryFn: () =>
|
||||
fetchConfigSyncCycleTasks({
|
||||
cycleId: expandedCycleId,
|
||||
page: taskPage,
|
||||
pageSize: 20,
|
||||
status: taskStatus,
|
||||
keyword: taskKeyword,
|
||||
}),
|
||||
enabled: Boolean(expandedCycleId),
|
||||
staleTime: 800,
|
||||
refetchInterval: () => (dashQuery.data?.running_cycle?.id === expandedCycleId ? POLL_MS : false),
|
||||
});
|
||||
|
||||
const targetsQuery = useQuery({
|
||||
queryKey: queryKeys.cliTargets(targetKeyword, targetPage, TARGET_PAGE_SIZE),
|
||||
queryFn: () =>
|
||||
fetchCliTargets({ source: "all", keyword: targetKeyword, page: targetPage, pageSize: TARGET_PAGE_SIZE }),
|
||||
enabled: scopeMode === "selected",
|
||||
staleTime: 5000,
|
||||
});
|
||||
|
||||
const refresh = async () => {
|
||||
await Promise.all([
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.configSyncDashboard }),
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.configSyncCyclesAll }),
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.configSyncCycleTasksAll }),
|
||||
]);
|
||||
};
|
||||
|
||||
const savePolicyMut = useMutation({
|
||||
mutationFn: () =>
|
||||
updateConfigSyncPolicy({
|
||||
enabled,
|
||||
interval_days: intervalDays,
|
||||
concurrency,
|
||||
scope_mode: scopeMode,
|
||||
history_keep: historyKeep,
|
||||
selected_targets: Object.values(selectedMap),
|
||||
}),
|
||||
onSuccess: async () => {
|
||||
showOk(t("configSync.policySaved"));
|
||||
setPolicyHydrated(false);
|
||||
await refresh();
|
||||
},
|
||||
onError: (err) => showError(String(err)),
|
||||
});
|
||||
|
||||
const startMut = useMutation({
|
||||
mutationFn: (mode: "full" | "retry_failed") => createConfigSyncCycle({ mode }),
|
||||
onSuccess: async () => {
|
||||
showOk(t("configSync.started"));
|
||||
await refresh();
|
||||
},
|
||||
onError: (err) => showError(String(err)),
|
||||
});
|
||||
|
||||
const pauseMut = useMutation({
|
||||
mutationFn: (id: string) => pauseConfigSyncCycle(id),
|
||||
onSuccess: async () => {
|
||||
showOk(t("configSync.paused"));
|
||||
await refresh();
|
||||
},
|
||||
onError: (err) => showError(String(err)),
|
||||
});
|
||||
|
||||
const resumeMut = useMutation({
|
||||
mutationFn: (id: string) => resumeConfigSyncCycle(id),
|
||||
onSuccess: async () => {
|
||||
showOk(t("configSync.resumed"));
|
||||
await refresh();
|
||||
},
|
||||
onError: (err) => showError(String(err)),
|
||||
});
|
||||
|
||||
const dash = dashQuery.data;
|
||||
const running = dash?.running_cycle;
|
||||
const last = dash?.last_cycle;
|
||||
const cycles = cyclesQuery.data?.items ?? [];
|
||||
const cycleTotal = Number(cyclesQuery.data?.total || 0);
|
||||
const cyclePages = pageCount(cycleTotal, 10);
|
||||
const selectedCount = useMemo(() => Object.keys(selectedMap).length, [selectedMap]);
|
||||
|
||||
const toggleTarget = (row: CliTargetItem) => {
|
||||
const source = row.source === "ume" ? "ume" : "managed";
|
||||
const key = `${source}:${row.id}`;
|
||||
setSelectedMap((prev) => {
|
||||
const next = { ...prev };
|
||||
if (next[key]) delete next[key];
|
||||
else next[key] = { source, id: row.id };
|
||||
return next;
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<section className="panel">
|
||||
<div className="panel__toolbar">
|
||||
<h2>{t("configSync.title")}</h2>
|
||||
<div className="btn-row">
|
||||
<button type="button" onClick={() => void refresh()} disabled={dashQuery.isFetching}>
|
||||
{t("common.refresh")}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="btn-primary"
|
||||
disabled={Boolean(running) || startMut.isPending}
|
||||
onClick={() => startMut.mutate("full")}
|
||||
>
|
||||
{t("configSync.syncNow")}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
disabled={Boolean(running) || startMut.isPending || !(last && last.fail_count > 0)}
|
||||
onClick={() => startMut.mutate("retry_failed")}
|
||||
>
|
||||
{t("configSync.retryFailed")}
|
||||
</button>
|
||||
{running?.status === "running" ? (
|
||||
<button type="button" onClick={() => pauseMut.mutate(running.id)} disabled={pauseMut.isPending}>
|
||||
{t("configSync.pause")}
|
||||
</button>
|
||||
) : null}
|
||||
{running?.status === "paused" ? (
|
||||
<button type="button" onClick={() => resumeMut.mutate(running.id)} disabled={resumeMut.isPending}>
|
||||
{t("configSync.resume")}
|
||||
</button>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="stat-grid" style={{ marginBottom: 16 }}>
|
||||
<div className="stat-card">
|
||||
<div className="muted">{t("configSync.kpi.snapshots")}</div>
|
||||
<strong>{dash?.snapshot_count ?? "-"}</strong>
|
||||
</div>
|
||||
<div className="stat-card">
|
||||
<div className="muted">{t("configSync.kpi.running")}</div>
|
||||
<strong>
|
||||
{running
|
||||
? `${running.status} · ${running.success_count}/${running.planned_count}`
|
||||
: t("configSync.kpi.idle")}
|
||||
</strong>
|
||||
</div>
|
||||
<div className="stat-card">
|
||||
<div className="muted">{t("configSync.kpi.last")}</div>
|
||||
<strong>
|
||||
{last
|
||||
? `${last.status} · ok ${last.success_count} / fail ${last.fail_count}`
|
||||
: t("common.empty")}
|
||||
</strong>
|
||||
</div>
|
||||
<div className="stat-card">
|
||||
<div className="muted">{t("configSync.kpi.nextDue")}</div>
|
||||
<strong>{dash?.next_due_at ? formatSystemTime(dash.next_due_at) : t("common.empty")}</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="panel" style={{ marginBottom: 16 }}>
|
||||
<h3>{t("configSync.policyTitle")}</h3>
|
||||
<div className="filter-inline" style={{ flexWrap: "wrap", gap: 12 }}>
|
||||
<label>
|
||||
<input type="checkbox" checked={enabled} onChange={(e) => setEnabled(e.target.checked)} />{" "}
|
||||
{t("configSync.enabled")}
|
||||
</label>
|
||||
<label>
|
||||
{t("configSync.intervalDays")}{" "}
|
||||
<input
|
||||
type="number"
|
||||
min={1}
|
||||
max={365}
|
||||
value={intervalDays}
|
||||
onChange={(e) => setIntervalDays(Math.max(1, Number(e.target.value) || 1))}
|
||||
style={{ width: 72 }}
|
||||
/>
|
||||
</label>
|
||||
<label>
|
||||
{t("configSync.concurrency")}{" "}
|
||||
<input
|
||||
type="number"
|
||||
min={1}
|
||||
max={30}
|
||||
value={concurrency}
|
||||
onChange={(e) => setConcurrency(Math.max(1, Math.min(30, Number(e.target.value) || 1)))}
|
||||
style={{ width: 72 }}
|
||||
/>
|
||||
</label>
|
||||
<label>
|
||||
{t("configSync.historyKeep")}{" "}
|
||||
<input
|
||||
type="number"
|
||||
min={0}
|
||||
max={30}
|
||||
value={historyKeep}
|
||||
onChange={(e) => setHistoryKeep(Math.max(0, Math.min(30, Number(e.target.value) || 0)))}
|
||||
style={{ width: 72 }}
|
||||
/>
|
||||
</label>
|
||||
<label>
|
||||
{t("configSync.scope")}{" "}
|
||||
<select
|
||||
value={scopeMode}
|
||||
onChange={(e) => setScopeMode(e.target.value === "selected" ? "selected" : "all")}
|
||||
>
|
||||
<option value="all">{t("configSync.scopeAll")}</option>
|
||||
<option value="selected">{t("configSync.scopeSelected")}</option>
|
||||
</select>
|
||||
</label>
|
||||
<button
|
||||
type="button"
|
||||
className="btn-primary"
|
||||
disabled={savePolicyMut.isPending}
|
||||
onClick={() => savePolicyMut.mutate()}
|
||||
>
|
||||
{t("configSync.savePolicy")}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{scopeMode === "selected" ? (
|
||||
<div style={{ marginTop: 12 }}>
|
||||
<p className="muted">{t("configSync.selectedCount", { count: String(selectedCount) })}</p>
|
||||
<div className="filter-inline">
|
||||
<input
|
||||
value={targetKeyword}
|
||||
placeholder={t("configSync.targetKeywordPh")}
|
||||
onChange={(e) => {
|
||||
setTargetKeyword(e.target.value);
|
||||
setTargetPage(1);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<table className="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th />
|
||||
<th>{t("configSync.col.source")}</th>
|
||||
<th>{t("configSync.col.name")}</th>
|
||||
<th>IP</th>
|
||||
<th>{t("configSync.col.vendor")}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{(targetsQuery.data?.items ?? []).map((row) => {
|
||||
const source = row.source === "ume" ? "ume" : "managed";
|
||||
const key = `${source}:${row.id}`;
|
||||
return (
|
||||
<tr key={key}>
|
||||
<td>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={Boolean(selectedMap[key])}
|
||||
onChange={() => toggleTarget(row)}
|
||||
/>
|
||||
</td>
|
||||
<td>{source}</td>
|
||||
<td>{row.name}</td>
|
||||
<td>{row.ip_address}</td>
|
||||
<td>{row.vendor || "-"}</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
<div className="pager">
|
||||
<button type="button" disabled={targetPage <= 1} onClick={() => setTargetPage((p) => p - 1)}>
|
||||
{t("common.prevPage")}
|
||||
</button>
|
||||
<span className="muted">
|
||||
{t("common.pagerMeta", {
|
||||
total: String(targetsQuery.data?.total ?? 0),
|
||||
page: String(targetPage),
|
||||
pages: String(pageCount(Number(targetsQuery.data?.total || 0), TARGET_PAGE_SIZE)),
|
||||
})}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
disabled={targetPage >= pageCount(Number(targetsQuery.data?.total || 0), TARGET_PAGE_SIZE)}
|
||||
onClick={() => setTargetPage((p) => p + 1)}
|
||||
>
|
||||
{t("common.nextPage")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
|
||||
<h3>{t("configSync.cyclesTitle")}</h3>
|
||||
<table className="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th />
|
||||
<th>ID</th>
|
||||
<th>{t("configSync.col.trigger")}</th>
|
||||
<th>{t("configSync.col.status")}</th>
|
||||
<th>{t("configSync.col.progress")}</th>
|
||||
<th>{t("configSync.col.started")}</th>
|
||||
<th>{t("configSync.col.ended")}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{cycles.map((c) => (
|
||||
<tr key={c.id}>
|
||||
<td>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setExpandedCycleId((id) => (id === c.id ? "" : c.id));
|
||||
setTaskPage(1);
|
||||
}}
|
||||
>
|
||||
{expandedCycleId === c.id ? t("configSync.collapse") : t("configSync.expand")}
|
||||
</button>
|
||||
</td>
|
||||
<td title={c.id}>{c.id.slice(0, 8)}</td>
|
||||
<td>{c.trigger_mode}</td>
|
||||
<td>{c.status}</td>
|
||||
<td>
|
||||
{c.success_count}/{c.planned_count} · fail {c.fail_count}
|
||||
</td>
|
||||
<td>{c.started_at ? formatSystemTime(c.started_at) : "-"}</td>
|
||||
<td>{c.ended_at ? formatSystemTime(c.ended_at) : "-"}</td>
|
||||
</tr>
|
||||
))}
|
||||
{!cycles.length ? (
|
||||
<tr>
|
||||
<td colSpan={7} className="muted">
|
||||
{t("configSync.cyclesEmpty")}
|
||||
</td>
|
||||
</tr>
|
||||
) : null}
|
||||
</tbody>
|
||||
</table>
|
||||
<div className="pager">
|
||||
<button type="button" disabled={cyclePage <= 1} onClick={() => setCyclePage((p) => p - 1)}>
|
||||
{t("common.prevPage")}
|
||||
</button>
|
||||
<span className="muted">
|
||||
{t("common.pagerMeta", { total: String(cycleTotal), page: String(cyclePage), pages: String(cyclePages) })}
|
||||
</span>
|
||||
<button type="button" disabled={cyclePage >= cyclePages} onClick={() => setCyclePage((p) => p + 1)}>
|
||||
{t("common.nextPage")}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{expandedCycleId ? (
|
||||
<div style={{ marginTop: 16 }}>
|
||||
<h3>{t("configSync.tasksTitle")}</h3>
|
||||
<div className="filter-inline">
|
||||
<input
|
||||
value={taskKeyword}
|
||||
placeholder={t("configSync.taskKeywordPh")}
|
||||
onChange={(e) => {
|
||||
setTaskKeyword(e.target.value);
|
||||
setTaskPage(1);
|
||||
}}
|
||||
/>
|
||||
<select
|
||||
value={taskStatus}
|
||||
onChange={(e) => {
|
||||
setTaskStatus(e.target.value);
|
||||
setTaskPage(1);
|
||||
}}
|
||||
>
|
||||
<option value="">{t("configSync.allStatus")}</option>
|
||||
<option value="pending">pending</option>
|
||||
<option value="running">running</option>
|
||||
<option value="success">success</option>
|
||||
<option value="fail">fail</option>
|
||||
<option value="skipped">skipped</option>
|
||||
</select>
|
||||
</div>
|
||||
<table className="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{t("configSync.col.name")}</th>
|
||||
<th>IP</th>
|
||||
<th>{t("configSync.col.vendor")}</th>
|
||||
<th>{t("configSync.col.source")}</th>
|
||||
<th>{t("configSync.col.status")}</th>
|
||||
<th>{t("configSync.col.message")}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{(tasksQuery.data?.items ?? []).map((task) => (
|
||||
<tr key={task.id}>
|
||||
<td>{task.ne_name || task.target_id}</td>
|
||||
<td>{task.ne_ip}</td>
|
||||
<td>{task.vendor || "-"}</td>
|
||||
<td>{task.source}</td>
|
||||
<td>{task.status}</td>
|
||||
<td title={task.message}>{task.message || "-"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
<div className="pager">
|
||||
<button type="button" disabled={taskPage <= 1} onClick={() => setTaskPage((p) => p - 1)}>
|
||||
{t("common.prevPage")}
|
||||
</button>
|
||||
<span className="muted">
|
||||
{t("common.pagerMeta", {
|
||||
total: String(tasksQuery.data?.total ?? 0),
|
||||
page: String(taskPage),
|
||||
pages: String(pageCount(Number(tasksQuery.data?.total || 0), 20)),
|
||||
})}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
disabled={taskPage >= pageCount(Number(tasksQuery.data?.total || 0), 20)}
|
||||
onClick={() => setTaskPage((p) => p + 1)}
|
||||
>
|
||||
{t("common.nextPage")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
</section>
|
||||
);
|
||||
}
|
||||
203
web/src/pages/network/NetworkConfigsPage.tsx
Normal file
203
web/src/pages/network/NetworkConfigsPage.tsx
Normal file
|
|
@ -0,0 +1,203 @@
|
|||
import { useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { fetchNeConfigSnapshotDetail, fetchNeConfigSnapshots } from "../../services/api";
|
||||
import { queryKeys } from "../../constants/queryKeys";
|
||||
import { useI18n } from "../../i18n";
|
||||
import { pageCount } from "../../utils/display";
|
||||
import { formatSystemTime } from "../../utils/time";
|
||||
|
||||
function fmtBytes(n: number): string {
|
||||
if (!n) return "0 B";
|
||||
if (n < 1024) return `${n} B`;
|
||||
if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)} KB`;
|
||||
return `${(n / (1024 * 1024)).toFixed(2)} MB`;
|
||||
}
|
||||
|
||||
export function NetworkConfigsPage() {
|
||||
const { t } = useI18n();
|
||||
const [page, setPage] = useState(1);
|
||||
const [keyword, setKeyword] = useState("");
|
||||
const [source, setSource] = useState("");
|
||||
const [vendor, setVendor] = useState("");
|
||||
const [selected, setSelected] = useState<{ source: string; id: string } | null>(null);
|
||||
const [tab, setTab] = useState<"primary" | "alt">("primary");
|
||||
|
||||
const listQuery = useQuery({
|
||||
queryKey: queryKeys.networkConfigs(page, keyword, source, vendor),
|
||||
queryFn: () =>
|
||||
fetchNeConfigSnapshots({ page, pageSize: 20, keyword, source, vendor }),
|
||||
staleTime: 5000,
|
||||
});
|
||||
|
||||
const detailQuery = useQuery({
|
||||
queryKey: queryKeys.networkConfigDetail(selected?.source || "", selected?.id || ""),
|
||||
queryFn: () => fetchNeConfigSnapshotDetail(selected!.source, selected!.id, "both"),
|
||||
enabled: Boolean(selected),
|
||||
staleTime: 10000,
|
||||
});
|
||||
|
||||
const items = listQuery.data?.items ?? [];
|
||||
const total = Number(listQuery.data?.total || 0);
|
||||
const pages = pageCount(total, 20);
|
||||
const detail = detailQuery.data;
|
||||
const showAlt = Boolean(detail?.has_alt);
|
||||
|
||||
return (
|
||||
<section className="panel">
|
||||
<div className="panel__toolbar">
|
||||
<h2>{t("networkConfigs.title")}</h2>
|
||||
</div>
|
||||
|
||||
<div className="filter-inline">
|
||||
<input
|
||||
value={keyword}
|
||||
placeholder={t("networkConfigs.keywordPh")}
|
||||
onChange={(e) => {
|
||||
setKeyword(e.target.value);
|
||||
setPage(1);
|
||||
}}
|
||||
/>
|
||||
<select
|
||||
value={source}
|
||||
onChange={(e) => {
|
||||
setSource(e.target.value);
|
||||
setPage(1);
|
||||
}}
|
||||
>
|
||||
<option value="">{t("networkConfigs.allSource")}</option>
|
||||
<option value="managed">managed</option>
|
||||
<option value="ume">ume</option>
|
||||
</select>
|
||||
<input
|
||||
value={vendor}
|
||||
placeholder={t("networkConfigs.vendorPh")}
|
||||
onChange={(e) => {
|
||||
setVendor(e.target.value);
|
||||
setPage(1);
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
disabled={!keyword && !source && !vendor}
|
||||
onClick={() => {
|
||||
setKeyword("");
|
||||
setSource("");
|
||||
setVendor("");
|
||||
setPage(1);
|
||||
}}
|
||||
>
|
||||
{t("common.clearFilters")}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{listQuery.isLoading ? <p className="muted">{t("common.refreshing")}</p> : null}
|
||||
|
||||
<table className="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{t("networkConfigs.col.name")}</th>
|
||||
<th>IP</th>
|
||||
<th>{t("networkConfigs.col.vendor")}</th>
|
||||
<th>{t("networkConfigs.col.source")}</th>
|
||||
<th>{t("networkConfigs.col.size")}</th>
|
||||
<th>{t("networkConfigs.col.collected")}</th>
|
||||
<th />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{items.map((row) => (
|
||||
<tr key={`${row.source}:${row.target_id}`}>
|
||||
<td>{row.ne_name || row.target_id}</td>
|
||||
<td>{row.ne_ip}</td>
|
||||
<td>{row.vendor || "-"}</td>
|
||||
<td>{row.source}</td>
|
||||
<td>{fmtBytes(row.plain_size)}</td>
|
||||
<td>{row.collected_at ? formatSystemTime(row.collected_at) : "-"}</td>
|
||||
<td>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setSelected({ source: row.source, id: row.target_id });
|
||||
setTab("primary");
|
||||
}}
|
||||
>
|
||||
{t("networkConfigs.view")}
|
||||
</button>
|
||||
<Link
|
||||
to={`/network/webcrt?${row.source === "ume" ? "ume_ne_id" : "ne_id"}=${encodeURIComponent(row.target_id)}`}
|
||||
style={{ marginLeft: 8 }}
|
||||
>
|
||||
WebCRT
|
||||
</Link>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
{!items.length && !listQuery.isLoading ? (
|
||||
<tr>
|
||||
<td colSpan={7} className="muted">
|
||||
{t("networkConfigs.empty")}
|
||||
</td>
|
||||
</tr>
|
||||
) : null}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div className="pager">
|
||||
<button type="button" disabled={page <= 1} onClick={() => setPage((p) => p - 1)}>
|
||||
{t("common.prevPage")}
|
||||
</button>
|
||||
<span className="muted">
|
||||
{t("common.pagerMeta", { total: String(total), page: String(page), pages: String(pages) })}
|
||||
</span>
|
||||
<button type="button" disabled={page >= pages} onClick={() => setPage((p) => p + 1)}>
|
||||
{t("common.nextPage")}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{selected ? (
|
||||
<div className="panel" style={{ marginTop: 16 }}>
|
||||
<div className="panel__toolbar">
|
||||
<h3>
|
||||
{detail?.ne_name || selected.id}{" "}
|
||||
<span className="muted">
|
||||
({selected.source} / {detail?.ne_ip || "-"})
|
||||
</span>
|
||||
</h3>
|
||||
<button type="button" onClick={() => setSelected(null)}>
|
||||
{t("networkConfigs.close")}
|
||||
</button>
|
||||
</div>
|
||||
{detailQuery.isLoading ? <p className="muted">{t("common.refreshing")}</p> : null}
|
||||
{showAlt ? (
|
||||
<div className="btn-row" style={{ marginBottom: 8 }}>
|
||||
<button
|
||||
type="button"
|
||||
className={tab === "primary" ? "btn-primary" : undefined}
|
||||
onClick={() => setTab("primary")}
|
||||
>
|
||||
{t("networkConfigs.tabSet")}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className={tab === "alt" ? "btn-primary" : undefined}
|
||||
onClick={() => setTab("alt")}
|
||||
>
|
||||
{t("networkConfigs.tabHier")}
|
||||
</button>
|
||||
</div>
|
||||
) : null}
|
||||
<textarea
|
||||
readOnly
|
||||
value={tab === "alt" ? detail?.config_alt_text || "" : detail?.config_text || ""}
|
||||
style={{ width: "100%", minHeight: 420, fontFamily: "ui-monospace, monospace", fontSize: 12 }}
|
||||
/>
|
||||
<p className="muted">
|
||||
SHA-256: {tab === "alt" ? detail?.config_alt_sha256 : detail?.config_sha256} ·{" "}
|
||||
{fmtBytes(tab === "alt" ? detail?.plain_alt_size || 0 : detail?.plain_size || 0)}
|
||||
</p>
|
||||
</div>
|
||||
) : null}
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
|
@ -23,6 +23,12 @@ import type {
|
|||
TopologyDiscoverStreamHandlers,
|
||||
TopologyGraph,
|
||||
TopologyMapItem,
|
||||
ConfigSyncCycle,
|
||||
ConfigSyncDashboard,
|
||||
ConfigSyncPolicy,
|
||||
ConfigSyncTask,
|
||||
NeConfigSnapshotDetail,
|
||||
NeConfigSnapshotMeta,
|
||||
} from "../types";
|
||||
|
||||
export const AUTH_TOKEN_KEY = "netx_access_token";
|
||||
|
|
@ -669,3 +675,73 @@ export async function discoverTopologyNeighborsStream(
|
|||
if (!finalReport) throw new Error("discover_stream_incomplete");
|
||||
return finalReport;
|
||||
}
|
||||
|
||||
export const fetchConfigSyncDashboard = () =>
|
||||
apiGet<ConfigSyncDashboard>("/v1/config-sync/dashboard");
|
||||
|
||||
export const fetchConfigSyncPolicy = () => apiGet<ConfigSyncPolicy>("/v1/config-sync/policy");
|
||||
|
||||
export const updateConfigSyncPolicy = (body: Partial<ConfigSyncPolicy>) =>
|
||||
apiPut<ConfigSyncPolicy>("/v1/config-sync/policy", body);
|
||||
|
||||
export const fetchConfigSyncCycles = (params: { page?: number; pageSize?: number }) => {
|
||||
const p = new URLSearchParams();
|
||||
p.set("page", String(Math.max(1, Number(params.page || 1))));
|
||||
p.set("page_size", String(Math.max(1, Math.min(100, Number(params.pageSize || 20)))));
|
||||
return apiGet<{ total: number; page: number; page_size: number; items: ConfigSyncCycle[] }>(
|
||||
`/v1/config-sync/cycles?${p.toString()}`,
|
||||
);
|
||||
};
|
||||
|
||||
export const createConfigSyncCycle = (body: { mode: "full" | "retry_failed"; cycle_id?: string }) =>
|
||||
apiPost<ConfigSyncCycle>("/v1/config-sync/cycles", body);
|
||||
|
||||
export const pauseConfigSyncCycle = (cycleId: string) =>
|
||||
apiPost<ConfigSyncCycle>(`/v1/config-sync/cycles/${encodeURIComponent(cycleId)}/pause`, {});
|
||||
|
||||
export const resumeConfigSyncCycle = (cycleId: string) =>
|
||||
apiPost<ConfigSyncCycle>(`/v1/config-sync/cycles/${encodeURIComponent(cycleId)}/resume`, {});
|
||||
|
||||
export const fetchConfigSyncCycleTasks = (params: {
|
||||
cycleId: string;
|
||||
page?: number;
|
||||
pageSize?: number;
|
||||
status?: string;
|
||||
keyword?: string;
|
||||
}) => {
|
||||
const p = new URLSearchParams();
|
||||
p.set("page", String(Math.max(1, Number(params.page || 1))));
|
||||
p.set("page_size", String(Math.max(1, Math.min(200, Number(params.pageSize || 20)))));
|
||||
if (params.status) p.set("status", params.status);
|
||||
if (params.keyword?.trim()) p.set("keyword", params.keyword.trim());
|
||||
return apiGet<{ total: number; page: number; page_size: number; items: ConfigSyncTask[] }>(
|
||||
`/v1/config-sync/cycles/${encodeURIComponent(params.cycleId)}/tasks?${p.toString()}`,
|
||||
);
|
||||
};
|
||||
|
||||
export const fetchNeConfigSnapshots = (params: {
|
||||
page?: number;
|
||||
pageSize?: number;
|
||||
keyword?: string;
|
||||
source?: string;
|
||||
vendor?: string;
|
||||
}) => {
|
||||
const p = new URLSearchParams();
|
||||
p.set("page", String(Math.max(1, Number(params.page || 1))));
|
||||
p.set("page_size", String(Math.max(1, Math.min(100, Number(params.pageSize || 20)))));
|
||||
if (params.keyword?.trim()) p.set("keyword", params.keyword.trim());
|
||||
if (params.source) p.set("source", params.source);
|
||||
if (params.vendor?.trim()) p.set("vendor", params.vendor.trim());
|
||||
return apiGet<{ total: number; page: number; page_size: number; items: NeConfigSnapshotMeta[] }>(
|
||||
`/v1/config-sync/snapshots?${p.toString()}`,
|
||||
);
|
||||
};
|
||||
|
||||
export const fetchNeConfigSnapshotDetail = (
|
||||
source: string,
|
||||
targetId: string,
|
||||
field: "primary" | "alt" | "both" = "both",
|
||||
) =>
|
||||
apiGet<NeConfigSnapshotDetail>(
|
||||
`/v1/config-sync/snapshots/${encodeURIComponent(source)}/${encodeURIComponent(targetId)}?field=${field}`,
|
||||
);
|
||||
|
|
|
|||
|
|
@ -429,3 +429,81 @@ export type TopologyDiscoverStreamHandlers = {
|
|||
onDone?: (report: TopologyDiscoverOut) => void;
|
||||
onError?: (detail: string) => void;
|
||||
};
|
||||
|
||||
export type ConfigSyncTargetRef = {
|
||||
source: "managed" | "ume";
|
||||
id: string;
|
||||
};
|
||||
|
||||
export type ConfigSyncPolicy = {
|
||||
enabled: boolean;
|
||||
interval_days: number;
|
||||
concurrency: number;
|
||||
scope_mode: string;
|
||||
selected_targets: ConfigSyncTargetRef[];
|
||||
history_keep: number;
|
||||
updated_at?: string | null;
|
||||
};
|
||||
|
||||
export type ConfigSyncCycle = {
|
||||
id: string;
|
||||
trigger_mode: string;
|
||||
status: string;
|
||||
concurrency: number;
|
||||
planned_count: number;
|
||||
success_count: number;
|
||||
fail_count: number;
|
||||
skip_count: number;
|
||||
error_message: string;
|
||||
started_at?: string | null;
|
||||
ended_at?: string | null;
|
||||
created_at?: string | null;
|
||||
};
|
||||
|
||||
export type ConfigSyncTask = {
|
||||
id: string;
|
||||
cycle_id: string;
|
||||
source: string;
|
||||
target_id: string;
|
||||
ne_name: string;
|
||||
ne_ip: string;
|
||||
vendor: string;
|
||||
status: string;
|
||||
message: string;
|
||||
started_at?: string | null;
|
||||
ended_at?: string | null;
|
||||
};
|
||||
|
||||
export type ConfigSyncDashboard = {
|
||||
policy: ConfigSyncPolicy;
|
||||
snapshot_count: number;
|
||||
last_cycle: ConfigSyncCycle | null;
|
||||
running_cycle: ConfigSyncCycle | null;
|
||||
next_due_at?: string | null;
|
||||
fail_by_vendor: Record<string, number>;
|
||||
};
|
||||
|
||||
export type NeConfigSnapshotMeta = {
|
||||
source: string;
|
||||
target_id: string;
|
||||
vendor: string;
|
||||
device_type: string;
|
||||
ne_name: string;
|
||||
ne_ip: string;
|
||||
config_sha256: string;
|
||||
config_alt_sha256: string;
|
||||
plain_size: number;
|
||||
plain_alt_size: number;
|
||||
zlib_size: number;
|
||||
zlib_alt_size: number;
|
||||
has_alt: boolean;
|
||||
commands: string[];
|
||||
collected_at?: string | null;
|
||||
last_cycle_id: string;
|
||||
};
|
||||
|
||||
export type NeConfigSnapshotDetail = NeConfigSnapshotMeta & {
|
||||
config_text: string;
|
||||
config_alt_text: string;
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue