feat: audit log, device tags, maintenance windows (v0.11.3 Beta)
- Audit log: middleware captures all write operations, paginated admin UI in Settings - Device tags: full CRUD, device assignment, filter bar and chips on Devices page - Maintenance windows: alert suppression during planned downtime, Settings management UI Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2GT-Rich
co-authored by
Claude Sonnet 4.6
Claude Sonnet 4.6
parent
6a4ab1fc5f
commit
49ab1b002e
@@ -2,7 +2,7 @@
|
||||
|
||||
A self-hosted, full-stack network management platform for MikroTik devices. Monitor, configure, and manage your entire MikroTik infrastructure — routers, switches, and wireless access points — from a single web interface.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "mikrotik-manager-backend",
|
||||
"version": "0.11.2-beta",
|
||||
"version": "0.11.3-beta",
|
||||
"description": "Mikrotik Network Management Platform - Backend API",
|
||||
"main": "dist/index.js",
|
||||
"scripts": {
|
||||
|
||||
@@ -291,6 +291,52 @@ CREATE TABLE IF NOT EXISTS credential_presets (
|
||||
);
|
||||
ALTER TABLE credential_presets ADD COLUMN IF NOT EXISTS allow_operator_use BOOLEAN NOT NULL DEFAULT TRUE;
|
||||
|
||||
-- Maintenance windows — suppress alerts for planned downtime
|
||||
CREATE TABLE IF NOT EXISTS maintenance_windows (
|
||||
id SERIAL PRIMARY KEY,
|
||||
name VARCHAR(100) NOT NULL,
|
||||
device_ids INTEGER[] NOT NULL DEFAULT '{}',
|
||||
start_at TIMESTAMPTZ NOT NULL,
|
||||
end_at TIMESTAMPTZ NOT NULL,
|
||||
recurring_cron VARCHAR(100),
|
||||
active BOOLEAN NOT NULL DEFAULT true,
|
||||
created_at TIMESTAMPTZ DEFAULT NOW()
|
||||
);
|
||||
CREATE INDEX IF NOT EXISTS idx_maintenance_windows_active ON maintenance_windows(active, start_at, end_at);
|
||||
|
||||
-- Device tags
|
||||
CREATE TABLE IF NOT EXISTS tags (
|
||||
id SERIAL PRIMARY KEY,
|
||||
name VARCHAR(50) NOT NULL UNIQUE,
|
||||
color VARCHAR(20) NOT NULL DEFAULT '#6366f1',
|
||||
created_at TIMESTAMPTZ DEFAULT NOW()
|
||||
);
|
||||
|
||||
CREATE TABLE IF NOT EXISTS device_tags (
|
||||
device_id INTEGER NOT NULL REFERENCES devices(id) ON DELETE CASCADE,
|
||||
tag_id INTEGER NOT NULL REFERENCES tags(id) ON DELETE CASCADE,
|
||||
PRIMARY KEY (device_id, tag_id)
|
||||
);
|
||||
CREATE INDEX IF NOT EXISTS idx_device_tags_tag ON device_tags(tag_id);
|
||||
|
||||
-- Audit log — records all write operations performed by authenticated users
|
||||
CREATE TABLE IF NOT EXISTS audit_log (
|
||||
id SERIAL PRIMARY KEY,
|
||||
user_id INTEGER,
|
||||
username VARCHAR(50),
|
||||
method VARCHAR(10) NOT NULL,
|
||||
path TEXT NOT NULL,
|
||||
entity_type VARCHAR(50),
|
||||
entity_id INTEGER,
|
||||
summary TEXT,
|
||||
ip_address VARCHAR(45),
|
||||
status_code INTEGER,
|
||||
created_at TIMESTAMPTZ DEFAULT NOW()
|
||||
);
|
||||
CREATE INDEX IF NOT EXISTS idx_audit_log_created ON audit_log(created_at DESC);
|
||||
CREATE INDEX IF NOT EXISTS idx_audit_log_user ON audit_log(user_id, created_at DESC);
|
||||
CREATE INDEX IF NOT EXISTS idx_audit_log_entity ON audit_log(entity_type, entity_id, created_at DESC);
|
||||
|
||||
-- Device availability (offline/online outage tracking)
|
||||
CREATE TABLE IF NOT EXISTS device_availability (
|
||||
id SERIAL PRIMARY KEY,
|
||||
|
||||
@@ -28,6 +28,9 @@ import { decrypt } from './utils/crypto';
|
||||
import { corsMiddlewareOptions, socketIoCorsOptions } from './utils/corsOrigins';
|
||||
|
||||
import authRoutes from './routes/auth';
|
||||
import auditLogRoutes from './routes/auditLog';
|
||||
import tagsRoutes from './routes/tags';
|
||||
import maintenanceWindowsRoutes from './routes/maintenanceWindows';
|
||||
import devicesRoutes, { setPollerService as setDevicesPoller } from './routes/devices';
|
||||
import clientsRoutes, { setPollerService as setClientsPoller } from './routes/clients';
|
||||
import eventsRoutes from './routes/events';
|
||||
@@ -43,6 +46,7 @@ import alertsRoutes from './routes/alerts';
|
||||
import wirelessRoutes from './routes/wireless';
|
||||
import networkServicesRoutes from './routes/networkServices';
|
||||
import credentialPresetsRoutes from './routes/credentialPresets';
|
||||
import { auditMiddleware } from './middleware/auditMiddleware';
|
||||
|
||||
const app = express();
|
||||
// nginx sits exactly one hop in front; trust its X-Forwarded-For so req.ip is the real client IP
|
||||
@@ -184,6 +188,7 @@ app.use(express.urlencoded({ extended: true }));
|
||||
if (process.env.NODE_ENV !== 'test') {
|
||||
app.use(morgan('combined'));
|
||||
}
|
||||
app.use(auditMiddleware);
|
||||
|
||||
// ─── Health Check ─────────────────────────────────────────────────────────────
|
||||
app.get('/api/health', (_req, res) => {
|
||||
@@ -207,6 +212,9 @@ app.use('/api/alerts', alertsRoutes);
|
||||
app.use('/api/wireless', wirelessRoutes);
|
||||
app.use('/api/network-services', networkServicesRoutes);
|
||||
app.use('/api/credential-presets', credentialPresetsRoutes);
|
||||
app.use('/api/audit-log', auditLogRoutes);
|
||||
app.use('/api/tags', tagsRoutes);
|
||||
app.use('/api/maintenance-windows', maintenanceWindowsRoutes);
|
||||
|
||||
// ─── Error Handler ────────────────────────────────────────────────────────────
|
||||
app.use(errorHandler);
|
||||
|
||||
@@ -0,0 +1,60 @@
|
||||
import { Request, Response, NextFunction } from 'express';
|
||||
import { query } from '../config/database';
|
||||
import { verifyToken } from './auth';
|
||||
|
||||
function extractEntity(path: string): { entityType: string | null; entityId: number | null } {
|
||||
// e.g. /api/devices/42/interfaces → 'device', 42
|
||||
const segments = path.replace(/^\/api\//, '').split('/');
|
||||
const resourceMap: Record<string, string> = {
|
||||
devices: 'device',
|
||||
backups: 'backup',
|
||||
clients: 'client',
|
||||
events: 'event',
|
||||
settings: 'settings',
|
||||
alerts: 'alert',
|
||||
topology: 'topology',
|
||||
wireless: 'wireless',
|
||||
'network-services': 'network_services',
|
||||
'credential-presets': 'credential_preset',
|
||||
'audit-log': 'audit_log',
|
||||
users: 'user',
|
||||
};
|
||||
const entityType = resourceMap[segments[0]] ?? segments[0] ?? null;
|
||||
const idRaw = segments[1];
|
||||
const entityId = idRaw && /^\d+$/.test(idRaw) ? parseInt(idRaw, 10) : null;
|
||||
return { entityType, entityId };
|
||||
}
|
||||
|
||||
function extractUser(req: Request): { userId: number | null; username: string | null } {
|
||||
if (req.user) return { userId: req.user.userId, username: req.user.username };
|
||||
const authHeader = req.headers.authorization;
|
||||
if (authHeader?.startsWith('Bearer ')) {
|
||||
try {
|
||||
const payload = verifyToken(authHeader.slice(7));
|
||||
return { userId: payload.userId, username: payload.username };
|
||||
} catch { /* expired/invalid — record as anonymous */ }
|
||||
}
|
||||
return { userId: null, username: null };
|
||||
}
|
||||
|
||||
export function auditMiddleware(req: Request, res: Response, next: NextFunction): void {
|
||||
if (req.method === 'GET' || req.method === 'HEAD' || req.method === 'OPTIONS') {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
|
||||
res.on('finish', () => {
|
||||
const { entityType, entityId } = extractEntity(req.path);
|
||||
const { userId, username } = extractUser(req);
|
||||
const summary = `${req.method} ${req.path}`;
|
||||
const ip = (req.ip ?? '').replace(/^::ffff:/, '');
|
||||
|
||||
query(
|
||||
`INSERT INTO audit_log (user_id, username, method, path, entity_type, entity_id, summary, ip_address, status_code)
|
||||
VALUES ($1,$2,$3,$4,$5,$6,$7,$8,$9)`,
|
||||
[userId, username, req.method, req.path, entityType, entityId, summary, ip, res.statusCode]
|
||||
).catch(() => {});
|
||||
});
|
||||
|
||||
next();
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
import { Router, Request, Response } from 'express';
|
||||
import { query } from '../config/database';
|
||||
import { requireAuth, requireAdmin } from '../middleware/auth';
|
||||
|
||||
const router = Router();
|
||||
router.use(requireAuth);
|
||||
router.use(requireAdmin);
|
||||
|
||||
// GET /api/audit-log?page=1&limit=50&userId=&entityType=&search=&from=&to=
|
||||
router.get('/', async (req: Request, res: Response) => {
|
||||
const page = Math.max(1, parseInt(String(req.query.page || '1'), 10));
|
||||
const limit = Math.min(100, Math.max(1, parseInt(String(req.query.limit || '50'), 10)));
|
||||
const offset = (page - 1) * limit;
|
||||
|
||||
const conditions: string[] = [];
|
||||
const params: unknown[] = [];
|
||||
|
||||
if (req.query.userId) {
|
||||
params.push(parseInt(String(req.query.userId), 10));
|
||||
conditions.push(`user_id = $${params.length}`);
|
||||
}
|
||||
if (req.query.entityType) {
|
||||
params.push(String(req.query.entityType));
|
||||
conditions.push(`entity_type = $${params.length}`);
|
||||
}
|
||||
if (req.query.search) {
|
||||
params.push(`%${String(req.query.search)}%`);
|
||||
conditions.push(`(summary ILIKE $${params.length} OR username ILIKE $${params.length} OR ip_address ILIKE $${params.length})`);
|
||||
}
|
||||
if (req.query.from) {
|
||||
params.push(String(req.query.from));
|
||||
conditions.push(`created_at >= $${params.length}`);
|
||||
}
|
||||
if (req.query.to) {
|
||||
params.push(String(req.query.to));
|
||||
conditions.push(`created_at <= $${params.length}`);
|
||||
}
|
||||
|
||||
const where = conditions.length ? `WHERE ${conditions.join(' AND ')}` : '';
|
||||
|
||||
const [rows, countRows] = await Promise.all([
|
||||
query<{
|
||||
id: number; user_id: number | null; username: string | null;
|
||||
method: string; path: string; entity_type: string | null;
|
||||
entity_id: number | null; summary: string; ip_address: string | null;
|
||||
status_code: number | null; created_at: string;
|
||||
}>(`SELECT * FROM audit_log ${where} ORDER BY created_at DESC LIMIT $${params.length + 1} OFFSET $${params.length + 2}`,
|
||||
[...params, limit, offset]
|
||||
),
|
||||
query<{ count: string }>(`SELECT COUNT(*) as count FROM audit_log ${where}`, params),
|
||||
]);
|
||||
|
||||
res.json({
|
||||
rows,
|
||||
total: parseInt(countRows[0]?.count || '0', 10),
|
||||
page,
|
||||
limit,
|
||||
});
|
||||
});
|
||||
|
||||
export default router;
|
||||
@@ -67,7 +67,23 @@ router.get('/', async (_req: Request, res: Response) => {
|
||||
rack_name, rack_slot, created_at
|
||||
FROM devices ORDER BY name ASC`
|
||||
);
|
||||
res.json(devices);
|
||||
|
||||
// Attach tags to each device
|
||||
const tagRows = await query<{ device_id: number; id: number; name: string; color: string }>(
|
||||
`SELECT dt.device_id, t.id, t.name, t.color
|
||||
FROM device_tags dt JOIN tags t ON t.id = dt.tag_id`
|
||||
);
|
||||
const tagsByDevice: Record<number, { id: number; name: string; color: string }[]> = {};
|
||||
for (const t of tagRows) {
|
||||
if (!tagsByDevice[t.device_id]) tagsByDevice[t.device_id] = [];
|
||||
tagsByDevice[t.device_id].push({ id: t.id, name: t.name, color: t.color });
|
||||
}
|
||||
const result = (devices as { id: number }[]).map((d) => ({
|
||||
...d,
|
||||
tags: tagsByDevice[d.id] ?? [],
|
||||
}));
|
||||
|
||||
res.json(result);
|
||||
});
|
||||
|
||||
// ─── Routers overview (router-type devices with route counts) ─────────────────
|
||||
|
||||
@@ -0,0 +1,88 @@
|
||||
import { Router, Request, Response } from 'express';
|
||||
import { query } from '../config/database';
|
||||
import { requireAuth, requireWrite, requireAdmin } from '../middleware/auth';
|
||||
|
||||
const router = Router();
|
||||
router.use(requireAuth);
|
||||
|
||||
export interface MaintenanceWindow {
|
||||
id: number;
|
||||
name: string;
|
||||
device_ids: number[];
|
||||
start_at: string;
|
||||
end_at: string;
|
||||
recurring_cron: string | null;
|
||||
active: boolean;
|
||||
created_at: string;
|
||||
}
|
||||
|
||||
// Returns true if deviceId is currently in an active maintenance window
|
||||
export async function isDeviceInMaintenance(deviceId: number): Promise<boolean> {
|
||||
const rows = await query<{ count: string }>(
|
||||
`SELECT COUNT(*)::text AS count FROM maintenance_windows
|
||||
WHERE active = true
|
||||
AND $1 = ANY(device_ids)
|
||||
AND NOW() BETWEEN start_at AND end_at`,
|
||||
[deviceId]
|
||||
).catch(() => [{ count: '0' }]);
|
||||
return parseInt(rows[0]?.count || '0', 10) > 0;
|
||||
}
|
||||
|
||||
// GET /api/maintenance-windows
|
||||
router.get('/', async (_req: Request, res: Response) => {
|
||||
const rows = await query<MaintenanceWindow>(
|
||||
`SELECT * FROM maintenance_windows ORDER BY start_at DESC`
|
||||
);
|
||||
res.json(rows);
|
||||
});
|
||||
|
||||
// POST /api/maintenance-windows (admin)
|
||||
router.post('/', requireAdmin, async (req: Request, res: Response) => {
|
||||
const { name, device_ids, start_at, end_at, recurring_cron } = req.body as {
|
||||
name: string; device_ids: number[]; start_at: string; end_at: string; recurring_cron?: string;
|
||||
};
|
||||
if (!name?.trim() || !start_at || !end_at) {
|
||||
res.status(400).json({ error: 'name, start_at, and end_at are required' });
|
||||
return;
|
||||
}
|
||||
const rows = await query<MaintenanceWindow>(
|
||||
`INSERT INTO maintenance_windows (name, device_ids, start_at, end_at, recurring_cron)
|
||||
VALUES ($1, $2, $3, $4, $5) RETURNING *`,
|
||||
[name.trim(), device_ids ?? [], start_at, end_at, recurring_cron || null]
|
||||
);
|
||||
res.status(201).json(rows[0]);
|
||||
});
|
||||
|
||||
// PUT /api/maintenance-windows/:id (admin)
|
||||
router.put('/:id', requireAdmin, async (req: Request, res: Response) => {
|
||||
const { name, device_ids, start_at, end_at, recurring_cron, active } = req.body as Partial<MaintenanceWindow>;
|
||||
const rows = await query<MaintenanceWindow>(
|
||||
`UPDATE maintenance_windows SET
|
||||
name = COALESCE($1, name),
|
||||
device_ids = COALESCE($2, device_ids),
|
||||
start_at = COALESCE($3, start_at),
|
||||
end_at = COALESCE($4, end_at),
|
||||
recurring_cron = COALESCE($5, recurring_cron),
|
||||
active = COALESCE($6, active)
|
||||
WHERE id = $7 RETURNING *`,
|
||||
[name, device_ids, start_at, end_at, recurring_cron, active, req.params.id]
|
||||
);
|
||||
if (!rows[0]) { res.status(404).json({ error: 'Not found' }); return; }
|
||||
res.json(rows[0]);
|
||||
});
|
||||
|
||||
// DELETE /api/maintenance-windows/:id (admin)
|
||||
router.delete('/:id', requireAdmin, async (req: Request, res: Response) => {
|
||||
await query(`DELETE FROM maintenance_windows WHERE id = $1`, [req.params.id]);
|
||||
res.json({ ok: true });
|
||||
});
|
||||
|
||||
// GET /api/maintenance-windows/active — currently active windows (used by AlertService)
|
||||
router.get('/active', requireWrite, async (_req: Request, res: Response) => {
|
||||
const rows = await query<MaintenanceWindow>(
|
||||
`SELECT * FROM maintenance_windows WHERE active = true AND NOW() BETWEEN start_at AND end_at`
|
||||
);
|
||||
res.json(rows);
|
||||
});
|
||||
|
||||
export default router;
|
||||
@@ -0,0 +1,85 @@
|
||||
import { Router, Request, Response } from 'express';
|
||||
import { query } from '../config/database';
|
||||
import { requireAuth, requireWrite, requireAdmin } from '../middleware/auth';
|
||||
|
||||
const router = Router();
|
||||
router.use(requireAuth);
|
||||
|
||||
// GET /api/tags — list all tags with device count
|
||||
router.get('/', async (_req: Request, res: Response) => {
|
||||
const tags = await query<{ id: number; name: string; color: string; device_count: string }>(
|
||||
`SELECT t.id, t.name, t.color, COUNT(dt.device_id)::text AS device_count
|
||||
FROM tags t
|
||||
LEFT JOIN device_tags dt ON dt.tag_id = t.id
|
||||
GROUP BY t.id ORDER BY t.name`
|
||||
);
|
||||
res.json(tags.map(t => ({ ...t, device_count: parseInt(t.device_count, 10) })));
|
||||
});
|
||||
|
||||
// POST /api/tags — create tag (admin only)
|
||||
router.post('/', requireAdmin, async (req: Request, res: Response) => {
|
||||
const { name, color } = req.body as { name: string; color?: string };
|
||||
if (!name?.trim()) { res.status(400).json({ error: 'Tag name is required' }); return; }
|
||||
const rows = await query<{ id: number; name: string; color: string }>(
|
||||
`INSERT INTO tags (name, color) VALUES ($1, $2) RETURNING id, name, color`,
|
||||
[name.trim(), color || '#6366f1']
|
||||
);
|
||||
res.status(201).json(rows[0]);
|
||||
});
|
||||
|
||||
// PUT /api/tags/:id — rename or recolor (admin only)
|
||||
router.put('/:id', requireAdmin, async (req: Request, res: Response) => {
|
||||
const { name, color } = req.body as { name?: string; color?: string };
|
||||
const rows = await query<{ id: number; name: string; color: string }>(
|
||||
`UPDATE tags SET
|
||||
name = COALESCE($1, name),
|
||||
color = COALESCE($2, color)
|
||||
WHERE id = $3 RETURNING id, name, color`,
|
||||
[name?.trim() || null, color || null, req.params.id]
|
||||
);
|
||||
if (!rows[0]) { res.status(404).json({ error: 'Tag not found' }); return; }
|
||||
res.json(rows[0]);
|
||||
});
|
||||
|
||||
// DELETE /api/tags/:id (admin only)
|
||||
router.delete('/:id', requireAdmin, async (req: Request, res: Response) => {
|
||||
await query(`DELETE FROM tags WHERE id = $1`, [req.params.id]);
|
||||
res.json({ ok: true });
|
||||
});
|
||||
|
||||
// POST /api/tags/:id/devices — assign tag to devices (operator+)
|
||||
router.post('/:id/devices', requireWrite, async (req: Request, res: Response) => {
|
||||
const tagId = parseInt(req.params.id, 10);
|
||||
const { deviceIds, action } = req.body as { deviceIds: number[]; action: 'add' | 'remove' };
|
||||
if (!Array.isArray(deviceIds) || deviceIds.length === 0) {
|
||||
res.status(400).json({ error: 'deviceIds array required' });
|
||||
return;
|
||||
}
|
||||
if (action === 'remove') {
|
||||
await query(
|
||||
`DELETE FROM device_tags WHERE tag_id = $1 AND device_id = ANY($2::int[])`,
|
||||
[tagId, deviceIds]
|
||||
);
|
||||
} else {
|
||||
for (const deviceId of deviceIds) {
|
||||
await query(
|
||||
`INSERT INTO device_tags (device_id, tag_id) VALUES ($1, $2) ON CONFLICT DO NOTHING`,
|
||||
[deviceId, tagId]
|
||||
);
|
||||
}
|
||||
}
|
||||
res.json({ ok: true });
|
||||
});
|
||||
|
||||
// GET /api/tags/device/:deviceId — tags for a specific device
|
||||
router.get('/device/:deviceId', async (req: Request, res: Response) => {
|
||||
const tags = await query<{ id: number; name: string; color: string }>(
|
||||
`SELECT t.id, t.name, t.color FROM tags t
|
||||
JOIN device_tags dt ON dt.tag_id = t.id
|
||||
WHERE dt.device_id = $1 ORDER BY t.name`,
|
||||
[req.params.deviceId]
|
||||
);
|
||||
res.json(tags);
|
||||
});
|
||||
|
||||
export default router;
|
||||
@@ -73,6 +73,19 @@ export class AlertService {
|
||||
const rule = await this.getRule(eventType);
|
||||
if (!rule?.enabled) return;
|
||||
|
||||
// Maintenance window suppression — skip if device is in a currently active window
|
||||
if (ctx.deviceId != null) {
|
||||
const inMaintenance = await query<{ count: string }>(
|
||||
`SELECT COUNT(*)::text AS count FROM maintenance_windows
|
||||
WHERE active = true AND $1 = ANY(device_ids) AND NOW() BETWEEN start_at AND end_at`,
|
||||
[ctx.deviceId]
|
||||
).catch(() => [{ count: '0' }]);
|
||||
if (parseInt(inMaintenance[0]?.count || '0', 10) > 0) {
|
||||
console.log(`[AlertService] Suppressed ${eventType} for device ${ctx.deviceId} (maintenance window)`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// Cooldown check
|
||||
const cooldownKey = ctx.cooldownKey ?? `${eventType}:${ctx.deviceId ?? 'global'}`;
|
||||
const cooldownMs = (rule.cooldown_min ?? 15) * 60 * 1000;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "mikrotik-manager-frontend",
|
||||
"version": "0.11.2-beta",
|
||||
"version": "0.11.3-beta",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
|
||||
@@ -5,7 +5,7 @@ import {
|
||||
Plus, RefreshCw, Router, Wifi, Trash2, ChevronRight, Search,
|
||||
Radar, ArrowUpCircle, Cpu, Pencil, ArrowUpDown, ArrowUp, ArrowDown,
|
||||
} from 'lucide-react';
|
||||
import { devicesApi, topologyApi, metricsApi } from '../services/api';
|
||||
import { devicesApi, topologyApi, metricsApi, tagsApi } from '../services/api';
|
||||
import type { Device } from '../types';
|
||||
import type { DiscoveredDevice } from '../services/api';
|
||||
import { useCanWrite } from '../hooks/useCanWrite';
|
||||
@@ -126,6 +126,7 @@ export default function DevicesPage() {
|
||||
});
|
||||
const [statusFilter, setStatusFilter] = useState<'all' | 'online' | 'offline' | 'updates'>('all');
|
||||
const [typeFilter, setTypeFilter] = useState<string | null>(null);
|
||||
const [tagFilter, setTagFilter] = useState<number | null>(null);
|
||||
|
||||
const { data: devices = [], isLoading } = useQuery({
|
||||
queryKey: ['devices'],
|
||||
@@ -139,6 +140,11 @@ export default function DevicesPage() {
|
||||
refetchInterval: 60_000,
|
||||
});
|
||||
|
||||
const { data: allTags = [] } = useQuery({
|
||||
queryKey: ['tags'],
|
||||
queryFn: () => tagsApi.list().then((r) => r.data),
|
||||
});
|
||||
|
||||
const syncMutation = useMutation({
|
||||
mutationFn: (id: number) => devicesApi.sync(id),
|
||||
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['devices'] }),
|
||||
@@ -184,6 +190,7 @@ export default function DevicesPage() {
|
||||
if (typeFilter === 'AP' && d.device_type !== 'wireless_ap') return false;
|
||||
if (typeFilter === 'SW' && d.device_type !== 'switch') return false;
|
||||
if (typeFilter === 'RTR' && d.device_type !== 'router') return false;
|
||||
if (tagFilter != null && !d.tags?.some(t => t.id === tagFilter)) return false;
|
||||
return true;
|
||||
});
|
||||
const sorted = [...base].sort((a, b) => {
|
||||
@@ -206,7 +213,7 @@ export default function DevicesPage() {
|
||||
return deviceSort.dir === 'asc' ? cmp : -cmp;
|
||||
});
|
||||
return sorted;
|
||||
}, [devices, search, statusFilter, typeFilter, deviceSort]);
|
||||
}, [devices, search, statusFilter, typeFilter, tagFilter, deviceSort]);
|
||||
|
||||
const discoveredList = discovered as DiscoveredDevice[];
|
||||
const duplicateCount = useMemo(
|
||||
@@ -338,6 +345,22 @@ export default function DevicesPage() {
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
{allTags.length > 0 && (
|
||||
<>
|
||||
<div className="w-px h-[18px] mx-1" style={{ background: 'var(--line)' }} />
|
||||
<select
|
||||
value={tagFilter ?? ''}
|
||||
onChange={e => setTagFilter(e.target.value ? parseInt(e.target.value, 10) : null)}
|
||||
className="mono text-[11px] px-[8px] py-[4px] rounded-[5px] transition-colors"
|
||||
style={{ background: 'var(--surface-2)', color: 'var(--ink-3)', border: '1px solid var(--line)' }}
|
||||
>
|
||||
<option value="">All tags</option>
|
||||
{allTags.map(t => (
|
||||
<option key={t.id} value={t.id}>{t.name}</option>
|
||||
))}
|
||||
</select>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Device table */}
|
||||
@@ -411,6 +434,19 @@ export default function DevicesPage() {
|
||||
</td>
|
||||
<td className="px-4 py-[12px]">
|
||||
<div className="text-[13px] font-medium" style={{ color: 'var(--ink)' }}>{device.name}</div>
|
||||
{device.tags && device.tags.length > 0 && (
|
||||
<div className="flex flex-wrap gap-1 mt-1">
|
||||
{device.tags.map(tag => (
|
||||
<span
|
||||
key={tag.id}
|
||||
className="text-[10px] px-[5px] py-[1px] rounded-full font-medium"
|
||||
style={{ background: tag.color + '33', color: tag.color, border: `1px solid ${tag.color}55` }}
|
||||
>
|
||||
{tag.name}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</td>
|
||||
<td className="px-4 py-[12px]">
|
||||
<TypePill type={device.device_type} />
|
||||
|
||||
@@ -2,9 +2,10 @@ import { useState, useRef } from 'react';
|
||||
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import {
|
||||
Settings, Users, Key, Plus, Trash2, CheckCircle, AlertCircle, Pencil, X,
|
||||
ShieldCheck, ShieldAlert, RefreshCw, Upload, Lock, Bell, Send, KeyRound,
|
||||
ShieldCheck, ShieldAlert, RefreshCw, Upload, Lock, Bell, Send, KeyRound, ClipboardList,
|
||||
} from 'lucide-react';
|
||||
import { settingsApi, authApi, certApi, alertsApi } from '../services/api';
|
||||
import { settingsApi, authApi, certApi, alertsApi, auditLogApi, tagsApi, maintenanceApi } from '../services/api';
|
||||
import type { MaintenanceWindow } from '../services/api';
|
||||
import type { CertInfo, AlertRule, AlertChannel } from '../services/api';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { useThemeStore } from '../store/themeStore';
|
||||
@@ -42,7 +43,12 @@ export default function SettingsPage() {
|
||||
const { theme, setTheme } = useThemeStore();
|
||||
const isAdmin = user?.role === 'admin';
|
||||
const canWrite = user?.role !== 'viewer';
|
||||
const [activeTab, setActiveTab] = useState<'general' | 'users' | 'credentials' | 'security' | 'certificate' | 'alerting'>('general');
|
||||
const [activeTab, setActiveTab] = useState<'general' | 'users' | 'credentials' | 'security' | 'certificate' | 'alerting' | 'audit' | 'tags' | 'maintenance'>('general');
|
||||
const [auditSearch, setAuditSearch] = useState('');
|
||||
const [auditPage, setAuditPage] = useState(1);
|
||||
const [newTagName, setNewTagName] = useState('');
|
||||
const [newTagColor, setNewTagColor] = useState('#6366f1');
|
||||
const [mwForm, setMwForm] = useState({ name: '', start_at: '', end_at: '' });
|
||||
|
||||
// ─── App settings ─────────────────────────────────────────────────────────
|
||||
const { data: settings = {} } = useQuery({
|
||||
@@ -186,6 +192,65 @@ export default function SettingsPage() {
|
||||
reader.readAsText(file);
|
||||
});
|
||||
|
||||
// ─── Tags ─────────────────────────────────────────────────────────────────
|
||||
const { data: tags = [] } = useQuery({
|
||||
queryKey: ['tags'],
|
||||
queryFn: () => tagsApi.list().then((r) => r.data),
|
||||
enabled: activeTab === 'tags',
|
||||
});
|
||||
|
||||
const createTagMutation = useMutation({
|
||||
mutationFn: () => tagsApi.create(newTagName.trim(), newTagColor),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['tags'] });
|
||||
setNewTagName('');
|
||||
},
|
||||
});
|
||||
|
||||
const deleteTagMutation = useMutation({
|
||||
mutationFn: (id: number) => tagsApi.delete(id),
|
||||
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['tags'] }),
|
||||
});
|
||||
|
||||
// ─── Maintenance Windows ───────────────────────────────────────────────────
|
||||
const { data: maintenanceWindows = [] } = useQuery({
|
||||
queryKey: ['maintenance-windows'],
|
||||
queryFn: () => maintenanceApi.list().then((r) => r.data),
|
||||
enabled: activeTab === 'maintenance',
|
||||
});
|
||||
|
||||
const createMwMutation = useMutation({
|
||||
mutationFn: () => maintenanceApi.create({
|
||||
name: mwForm.name.trim(),
|
||||
device_ids: [],
|
||||
start_at: mwForm.start_at,
|
||||
end_at: mwForm.end_at,
|
||||
recurring_cron: null,
|
||||
active: true,
|
||||
}),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['maintenance-windows'] });
|
||||
setMwForm({ name: '', start_at: '', end_at: '' });
|
||||
},
|
||||
});
|
||||
|
||||
const deleteMwMutation = useMutation({
|
||||
mutationFn: (id: number) => maintenanceApi.delete(id),
|
||||
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['maintenance-windows'] }),
|
||||
});
|
||||
|
||||
const toggleMwMutation = useMutation({
|
||||
mutationFn: ({ id, active }: { id: number; active: boolean }) => maintenanceApi.update(id, { active }),
|
||||
onSuccess: () => queryClient.invalidateQueries({ queryKey: ['maintenance-windows'] }),
|
||||
});
|
||||
|
||||
// ─── Audit Log ────────────────────────────────────────────────────────────
|
||||
const { data: auditData } = useQuery({
|
||||
queryKey: ['audit-log', auditPage, auditSearch],
|
||||
queryFn: () => auditLogApi.list({ page: auditPage, limit: 50, search: auditSearch || undefined }).then((r) => r.data),
|
||||
enabled: activeTab === 'audit',
|
||||
});
|
||||
|
||||
// ─── Alerting ──────────────────────────────────────────────────────────────
|
||||
const { data: alertRules = [] } = useQuery({
|
||||
queryKey: ['alert-rules'],
|
||||
@@ -284,6 +349,11 @@ export default function SettingsPage() {
|
||||
{ key: 'security' as const, label: 'My Password', icon: Key },
|
||||
{ key: 'certificate' as const, label: 'Certificate', icon: Lock },
|
||||
{ key: 'alerting' as const, label: 'Alerting', icon: Bell },
|
||||
...(isAdmin ? [
|
||||
{ key: 'tags' as const, label: 'Tags', icon: ShieldCheck },
|
||||
{ key: 'maintenance' as const, label: 'Maintenance', icon: ShieldAlert },
|
||||
{ key: 'audit' as const, label: 'Audit Log', icon: ClipboardList },
|
||||
] : []),
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -1414,6 +1484,258 @@ export default function SettingsPage() {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{/* ── Tags ── */}
|
||||
{activeTab === 'tags' && (
|
||||
<div className="space-y-4">
|
||||
<div className="card p-5">
|
||||
<h3 className="text-sm font-semibold text-gray-900 dark:text-white mb-4">Device Tags</h3>
|
||||
{isAdmin && (
|
||||
<div className="flex items-center gap-2 mb-4">
|
||||
<input
|
||||
type="color"
|
||||
value={newTagColor}
|
||||
onChange={(e) => setNewTagColor(e.target.value)}
|
||||
className="w-8 h-8 rounded cursor-pointer border border-gray-300 dark:border-slate-600 p-0.5"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Tag name…"
|
||||
value={newTagName}
|
||||
onChange={(e) => setNewTagName(e.target.value)}
|
||||
onKeyDown={(e) => e.key === 'Enter' && newTagName.trim() && createTagMutation.mutate()}
|
||||
className="input-field flex-1 text-sm"
|
||||
/>
|
||||
<button
|
||||
onClick={() => createTagMutation.mutate()}
|
||||
disabled={!newTagName.trim() || createTagMutation.isPending}
|
||||
className="btn-primary text-sm px-3 py-1.5"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
<div className="space-y-2">
|
||||
{tags.map((tag) => (
|
||||
<div key={tag.id} className="flex items-center justify-between p-3 rounded-lg" style={{ background: 'var(--surface-2)' }}>
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="w-4 h-4 rounded-full" style={{ background: tag.color }} />
|
||||
<span className="text-sm font-medium text-gray-900 dark:text-white">{tag.name}</span>
|
||||
<span className="text-xs text-gray-400 dark:text-slate-500">{tag.device_count} device{tag.device_count !== 1 ? 's' : ''}</span>
|
||||
</div>
|
||||
{isAdmin && (
|
||||
<button
|
||||
onClick={() => deleteTagMutation.mutate(tag.id)}
|
||||
className="p-1 rounded text-gray-400 hover:text-red-500 transition-colors"
|
||||
>
|
||||
<Trash2 className="w-4 h-4" />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
{tags.length === 0 && (
|
||||
<p className="text-sm text-gray-400 dark:text-slate-500 text-center py-4">No tags created yet</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ── Maintenance Windows ── */}
|
||||
{activeTab === 'maintenance' && (
|
||||
<div className="space-y-4">
|
||||
<div className="card p-5">
|
||||
<h3 className="text-sm font-semibold text-gray-900 dark:text-white mb-1">Maintenance Windows</h3>
|
||||
<p className="text-xs text-gray-500 dark:text-slate-400 mb-4">
|
||||
Alerts are suppressed for devices during active maintenance windows.
|
||||
</p>
|
||||
|
||||
{isAdmin && (
|
||||
<div className="grid grid-cols-1 sm:grid-cols-3 gap-2 mb-4">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Window name…"
|
||||
value={mwForm.name}
|
||||
onChange={(e) => setMwForm(f => ({ ...f, name: e.target.value }))}
|
||||
className="input-field text-sm"
|
||||
/>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label className="text-xs text-gray-500 dark:text-slate-400">Start</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
value={mwForm.start_at}
|
||||
onChange={(e) => setMwForm(f => ({ ...f, start_at: e.target.value }))}
|
||||
className="input-field text-sm"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label className="text-xs text-gray-500 dark:text-slate-400">End</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
value={mwForm.end_at}
|
||||
onChange={(e) => setMwForm(f => ({ ...f, end_at: e.target.value }))}
|
||||
className="input-field text-sm"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => createMwMutation.mutate()}
|
||||
disabled={!mwForm.name.trim() || !mwForm.start_at || !mwForm.end_at || createMwMutation.isPending}
|
||||
className="btn-primary text-sm sm:col-span-3 justify-center flex items-center gap-2"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
Create Window
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="space-y-2">
|
||||
{(maintenanceWindows as MaintenanceWindow[]).map((mw) => {
|
||||
const now = new Date();
|
||||
const start = new Date(mw.start_at);
|
||||
const end = new Date(mw.end_at);
|
||||
const isActive = mw.active && now >= start && now <= end;
|
||||
const isPast = now > end;
|
||||
return (
|
||||
<div key={mw.id} className={clsx(
|
||||
'flex items-center justify-between p-3 rounded-lg',
|
||||
isActive ? 'border border-yellow-400 dark:border-yellow-600' : ''
|
||||
)} style={{ background: 'var(--surface-2)' }}>
|
||||
<div>
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-sm font-medium text-gray-900 dark:text-white">{mw.name}</span>
|
||||
{isActive && <span className="text-xs px-1.5 py-0.5 rounded bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400">Active</span>}
|
||||
{isPast && <span className="text-xs px-1.5 py-0.5 rounded bg-gray-100 text-gray-500 dark:bg-slate-700 dark:text-slate-400">Expired</span>}
|
||||
{!mw.active && <span className="text-xs px-1.5 py-0.5 rounded bg-gray-100 text-gray-400 dark:bg-slate-700 dark:text-slate-500">Disabled</span>}
|
||||
</div>
|
||||
<div className="text-xs text-gray-400 dark:text-slate-500 mt-0.5">
|
||||
{new Date(mw.start_at).toLocaleString()} – {new Date(mw.end_at).toLocaleString()}
|
||||
{mw.device_ids.length > 0 && ` · ${mw.device_ids.length} device(s)`}
|
||||
</div>
|
||||
</div>
|
||||
{isAdmin && (
|
||||
<div className="flex items-center gap-2">
|
||||
<button
|
||||
onClick={() => toggleMwMutation.mutate({ id: mw.id, active: !mw.active })}
|
||||
className="text-xs px-2 py-1 rounded border border-gray-300 dark:border-slate-600 text-gray-500 dark:text-slate-400 hover:text-gray-700 dark:hover:text-slate-300"
|
||||
>
|
||||
{mw.active ? 'Disable' : 'Enable'}
|
||||
</button>
|
||||
<button
|
||||
onClick={() => deleteMwMutation.mutate(mw.id)}
|
||||
className="p-1 rounded text-gray-400 hover:text-red-500 transition-colors"
|
||||
>
|
||||
<Trash2 className="w-4 h-4" />
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
{(maintenanceWindows as MaintenanceWindow[]).length === 0 && (
|
||||
<p className="text-sm text-gray-400 dark:text-slate-500 text-center py-4">No maintenance windows created</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ── Audit Log ── */}
|
||||
{activeTab === 'audit' && (
|
||||
<div className="space-y-4">
|
||||
<div className="card p-5">
|
||||
<div className="flex items-center justify-between mb-4 flex-wrap gap-3">
|
||||
<h3 className="text-sm font-semibold text-gray-900 dark:text-white flex items-center gap-2">
|
||||
<ClipboardList className="w-4 h-4 text-blue-500" />
|
||||
Audit Log
|
||||
</h3>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search user, path, IP…"
|
||||
value={auditSearch}
|
||||
onChange={(e) => { setAuditSearch(e.target.value); setAuditPage(1); }}
|
||||
className="input-field w-64 text-sm"
|
||||
/>
|
||||
</div>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead>
|
||||
<tr className="text-left text-xs text-gray-500 dark:text-slate-400 border-b border-gray-200 dark:border-slate-700">
|
||||
<th className="pb-2 pr-4">Time</th>
|
||||
<th className="pb-2 pr-4">User</th>
|
||||
<th className="pb-2 pr-4">Action</th>
|
||||
<th className="pb-2 pr-4">Entity</th>
|
||||
<th className="pb-2 pr-4">Status</th>
|
||||
<th className="pb-2">IP</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{(auditData?.rows ?? []).map((row) => (
|
||||
<tr key={row.id} className="border-b border-gray-100 dark:border-slate-700/50">
|
||||
<td className="py-2 pr-4 font-mono text-xs text-gray-400 whitespace-nowrap">
|
||||
{new Date(row.created_at).toLocaleString()}
|
||||
</td>
|
||||
<td className="py-2 pr-4 font-medium">{row.username ?? '—'}</td>
|
||||
<td className="py-2 pr-4 font-mono text-xs">
|
||||
<span className={clsx(
|
||||
'px-1.5 py-0.5 rounded text-xs font-semibold mr-2',
|
||||
row.method === 'DELETE' ? 'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400' :
|
||||
row.method === 'POST' ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400' :
|
||||
'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400'
|
||||
)}>
|
||||
{row.method}
|
||||
</span>
|
||||
<span className="text-gray-500 dark:text-slate-400 truncate max-w-[200px] inline-block align-bottom" title={row.path}>{row.path}</span>
|
||||
</td>
|
||||
<td className="py-2 pr-4 text-gray-500 dark:text-slate-400">
|
||||
{row.entity_type ? (row.entity_id ? `${row.entity_type}#${row.entity_id}` : row.entity_type) : '—'}
|
||||
</td>
|
||||
<td className="py-2 pr-4">
|
||||
<span className={clsx(
|
||||
'px-1.5 py-0.5 rounded text-xs font-semibold',
|
||||
(row.status_code ?? 200) < 300 ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400' :
|
||||
(row.status_code ?? 200) < 500 ? 'bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400' :
|
||||
'bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400'
|
||||
)}>
|
||||
{row.status_code ?? '—'}
|
||||
</span>
|
||||
</td>
|
||||
<td className="py-2 font-mono text-xs text-gray-400">{row.ip_address ?? '—'}</td>
|
||||
</tr>
|
||||
))}
|
||||
{(auditData?.rows ?? []).length === 0 && (
|
||||
<tr>
|
||||
<td colSpan={6} className="py-8 text-center text-gray-400 dark:text-slate-500">
|
||||
No audit log entries yet
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{(auditData?.total ?? 0) > 50 && (
|
||||
<div className="flex items-center justify-between mt-4 text-sm text-gray-500 dark:text-slate-400">
|
||||
<span>{auditData?.total} total entries</span>
|
||||
<div className="flex gap-2">
|
||||
<button
|
||||
onClick={() => setAuditPage((p) => Math.max(1, p - 1))}
|
||||
disabled={auditPage <= 1}
|
||||
className="btn-secondary text-xs px-3 py-1 disabled:opacity-50"
|
||||
>
|
||||
Prev
|
||||
</button>
|
||||
<span className="px-2 py-1">Page {auditPage}</span>
|
||||
<button
|
||||
onClick={() => setAuditPage((p) => p + 1)}
|
||||
disabled={auditPage * 50 >= (auditData?.total ?? 0)}
|
||||
className="btn-secondary text-xs px-3 py-1 disabled:opacity-50"
|
||||
>
|
||||
Next
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -728,4 +728,52 @@ export const networkServicesApi = {
|
||||
api.delete(`/network-services/wireguard/peer/${encodeURIComponent(id)}`, { params: { deviceId } }),
|
||||
};
|
||||
|
||||
// ─── Maintenance Windows ──────────────────────────────────────────────────────
|
||||
export interface MaintenanceWindow {
|
||||
id: number;
|
||||
name: string;
|
||||
device_ids: number[];
|
||||
start_at: string;
|
||||
end_at: string;
|
||||
recurring_cron: string | null;
|
||||
active: boolean;
|
||||
created_at: string;
|
||||
}
|
||||
export const maintenanceApi = {
|
||||
list: () => api.get<MaintenanceWindow[]>('/maintenance-windows'),
|
||||
create: (data: Omit<MaintenanceWindow, 'id' | 'created_at'>) =>
|
||||
api.post<MaintenanceWindow>('/maintenance-windows', data),
|
||||
update: (id: number, data: Partial<MaintenanceWindow>) =>
|
||||
api.put<MaintenanceWindow>(`/maintenance-windows/${id}`, data),
|
||||
delete: (id: number) => api.delete(`/maintenance-windows/${id}`),
|
||||
};
|
||||
|
||||
// ─── Tags ────────────────────────────────────────────────────────────────────
|
||||
export const tagsApi = {
|
||||
list: () => api.get<import('../types').Tag[]>('/tags'),
|
||||
create: (name: string, color: string) => api.post<import('../types').Tag>('/tags', { name, color }),
|
||||
update: (id: number, data: { name?: string; color?: string }) => api.put<import('../types').Tag>(`/tags/${id}`, data),
|
||||
delete: (id: number) => api.delete(`/tags/${id}`),
|
||||
assignDevices: (tagId: number, deviceIds: number[], action: 'add' | 'remove') =>
|
||||
api.post(`/tags/${tagId}/devices`, { deviceIds, action }),
|
||||
deviceTags: (deviceId: number) => api.get<import('../types').Tag[]>(`/tags/device/${deviceId}`),
|
||||
};
|
||||
|
||||
// ─── Audit Log ───────────────────────────────────────────────────────────────
|
||||
export const auditLogApi = {
|
||||
list: (params: {
|
||||
page?: number; limit?: number; userId?: number; entityType?: string;
|
||||
search?: string; from?: string; to?: string;
|
||||
} = {}) =>
|
||||
api.get<{
|
||||
rows: {
|
||||
id: number; user_id: number | null; username: string | null;
|
||||
method: string; path: string; entity_type: string | null;
|
||||
entity_id: number | null; summary: string; ip_address: string | null;
|
||||
status_code: number | null; created_at: string;
|
||||
}[];
|
||||
total: number; page: number; limit: number;
|
||||
}>('/audit-log', { params }),
|
||||
};
|
||||
|
||||
export default api;
|
||||
|
||||
@@ -69,6 +69,14 @@ export interface Device {
|
||||
rack_slot?: string;
|
||||
created_at: string;
|
||||
updated_at?: string;
|
||||
tags?: { id: number; name: string; color: string }[];
|
||||
}
|
||||
|
||||
export interface Tag {
|
||||
id: number;
|
||||
name: string;
|
||||
color: string;
|
||||
device_count?: number;
|
||||
}
|
||||
|
||||
export interface Interface {
|
||||
|
||||
@@ -1 +1 @@
|
||||
export const APP_VERSION = 'v0.11.2 Beta';
|
||||
export const APP_VERSION = 'v0.11.3 Beta';
|
||||
|
||||
Reference in New Issue
Block a user