feat: Zabbix 数据源管理 — 完整 CRUD + 双 Tab 数据源页面
后端: - models/zabbix_datasource.go: Zabbix 数据源 model (15字段, 参照 Grafana) - handlers/zabbix_datasource.go: CRUD + 测试连接 (调用 Zabbix API Auth) - routes.go: /zabbix-datasources 路由组 - database.go: AutoMigrate 前端: - api.ts: zabbixDatasourceApi - ZabbixDatasourceManager.tsx: 表单 (URL/用户名/密码/Trends设置/DB直连) - DatasourcePage.tsx: Prometheus + Zabbix 双 Tab 包装 - App.tsx: /datasources 路由更新
This commit is contained in:
1 parent
d2201fc8c0
commit
c51d0b8b8b
8 files changed
+761
-2
No files matched your search
@@ -0,0 +1,47 @@
|
||||
// 数据源管理页面 — Prometheus + Zabbix 双 Tab // Logan.Li
|
||||
import { useState } from 'react';
|
||||
import { Database } from 'lucide-react';
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||
import PrometheusDatasourceManager from '@/components/monitor/datasource/PrometheusDatasourceManager';
|
||||
import ZabbixDatasourceManager from '@/components/monitor/datasource/ZabbixDatasourceManager';
|
||||
|
||||
export default function DatasourcePage() {
|
||||
const [activeTab, setActiveTab] = useState('prometheus');
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<Database className="h-5 w-5 text-blue-400" />
|
||||
<h1 className="text-xl font-bold text-[var(--dg-text-primary)]">数据源管理</h1>
|
||||
</div>
|
||||
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab}>
|
||||
<TabsList className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
|
||||
<TabsTrigger value="prometheus" className="data-[state=active]:bg-orange-500/10 data-[state=active]:text-orange-400">
|
||||
<img
|
||||
src="https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons@master/png/prometheus.png"
|
||||
className="w-4 h-4 rounded mr-1.5"
|
||||
onError={(e) => { (e.target as HTMLImageElement).style.display = 'none'; }}
|
||||
/>
|
||||
Prometheus
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="zabbix" className="data-[state=active]:bg-orange-500/10 data-[state=active]:text-orange-400">
|
||||
<img
|
||||
src="https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons@master/png/zabbix.png"
|
||||
className="w-4 h-4 rounded mr-1.5"
|
||||
onError={(e) => { (e.target as HTMLImageElement).style.display = 'none'; }}
|
||||
/>
|
||||
Zabbix
|
||||
</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
<TabsContent value="prometheus" className="mt-4">
|
||||
<PrometheusDatasourceManager />
|
||||
</TabsContent>
|
||||
<TabsContent value="zabbix" className="mt-4">
|
||||
<ZabbixDatasourceManager />
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user