DBT/clawgo
1
0
Fork 0
mirror of https://github.com/YspCoder/clawgo.git synced 2026-04-13 05:37:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: simplify dashboard and agents canvas panel

Browse Source
This commit is contained in:
lpf
2026-03-07 22:28:20 +08:00
parent a2f340b513
commit e3e1ab5586
3 changed files with 5 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
webui/src/index.css
View File

@@ -332,25 +332,6 @@ html.theme-dark .brand-button {
border-radius: var(--radius-panel);
}
.topology-stream-panel {
left: 1rem;
right: 1rem;
bottom: 1rem;
height: 48vh;
}
@media (min-width: 768px) {
.topology-stream-panel {
left: auto;
right: 1rem;
top: 1rem;
bottom: 1rem;
width: 360px;
max-width: calc(100% - 2rem);
height: auto;
}
}
.rounded-xl {
border-radius: var(--radius-button) !important;
}

55
webui/src/pages/Dashboard.tsx
View File

@@ -1,5 +1,5 @@
import React, { useMemo } from 'react';
import { RefreshCw, Activity, MessageSquare, Clock, Server, Wrench, Sparkles, AlertTriangle, Workflow } from 'lucide-react';
import { RefreshCw, Activity, MessageSquare, Wrench, Sparkles, AlertTriangle, Workflow } from 'lucide-react';
import { useTranslation } from 'react-i18next';
import { useAppContext } from '../context/AppContext';
import StatCard from '../components/StatCard';
@@ -9,8 +9,6 @@ const Dashboard: React.FC = () => {
const {
isGatewayOnline,
sessions,
cron,
nodes,
refreshAll,
gatewayVersion,
webuiVersion,
@@ -20,30 +18,6 @@ const Dashboard: React.FC = () => {
ekgSummary,
} = useAppContext();
const parsedNodes = useMemo(() => {
try {
const arr = JSON.parse(nodes);
return Array.isArray(arr) ? arr : [];
} catch {
return [];
}
}, [nodes]);
const onlineNodes = useMemo(
() => parsedNodes.filter((n: any) => n?.online).length,
[parsedNodes],
);
const pausedCron = useMemo(
() => cron.filter((job) => !job.enabled).length,
[cron],
);
const enabledCron = useMemo(
() => cron.filter((job) => job.enabled).length,
[cron],
);
const subagentCount = useMemo(() => {
const subagents = (cfg as any)?.agents?.subagents || {};
return Object.keys(subagents).length;
@@ -79,13 +53,12 @@ const Dashboard: React.FC = () => {
</button>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 2xl:grid-cols-6 gap-4">
<div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-5 gap-4">
<StatCard title={t('gatewayStatus')} value={isGatewayOnline ? t('online') : t('offline')} icon={<Activity className={`w-6 h-6 ${isGatewayOnline ? 'text-emerald-400' : 'text-red-400'}`} />} />
<StatCard title={t('activeSessions')} value={sessions.length} icon={<MessageSquare className="w-6 h-6 text-blue-400" />} />
<StatCard title={t('nodesOnline')} value={onlineNodes} icon={<Server className="w-6 h-6 text-amber-400" />} />
<StatCard title={t('cronJobs')} value={cron.length} icon={<Clock className="w-6 h-6 text-purple-400" />} />
<StatCard title={t('skills')} value={skills.length} icon={<Sparkles className="w-6 h-6 text-pink-400" />} />
<StatCard title={t('subagentsRuntime')} value={subagentCount} icon={<Wrench className="w-6 h-6 text-cyan-400" />} />
<StatCard title={t('taskAudit')} value={recentTasks.length} icon={<Activity className="w-6 h-6 text-amber-400" />} />
</div>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-4">
@@ -115,28 +88,6 @@ const Dashboard: React.FC = () => {
</div>
</div>
<div className="grid grid-cols-1 xl:grid-cols-2 gap-6 items-stretch">
<div className="brand-card rounded-[30px] border border-zinc-800/80 p-6 min-h-[340px] h-full">
<div className="flex items-center gap-2 mb-5 text-zinc-200">
<Clock className="w-5 h-5 text-zinc-400" />
<h2 className="text-lg font-medium">{t('recentCron')}</h2>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="brand-card-subtle rounded-2xl border border-zinc-800 p-4 min-h-[104px]">
<div className="text-[11px] uppercase tracking-widest text-zinc-500">{t('active')}</div>
<div className="mt-2 text-2xl font-semibold text-zinc-100">{enabledCron}</div>
</div>
<div className="brand-card-subtle rounded-2xl border border-zinc-800 p-4 min-h-[104px]">
<div className="text-[11px] uppercase tracking-widest text-zinc-500">{t('paused')}</div>
<div className="mt-2 text-2xl font-semibold text-zinc-100">{pausedCron}</div>
</div>
</div>
<div className="h-[180px] flex items-center justify-center text-sm text-zinc-500">
{cron.length === 0 ? t('noCronJobs') : `${cron.length} ${t('cronJobs')}`}
</div>
</div>
</div>
<div className="grid grid-cols-1 xl:grid-cols-2 gap-6 items-stretch">
<div className="brand-card rounded-[30px] border border-zinc-800/80 p-6 min-h-[340px] h-full">
<div className="flex items-center gap-2 mb-5 text-zinc-200">

4
webui/src/pages/Subagents.tsx
View File

@@ -1174,7 +1174,7 @@ const Subagents: React.FC = () => {
{selectedAgentID && (
<div
onWheelCapture={(event) => event.stopPropagation()}
className="topology-stream-panel radius-panel absolute z-20 brand-card border border-zinc-800 shadow-2xl shadow-black/40 backdrop-blur-md overflow-hidden flex flex-col"
className="absolute bottom-4 left-4 right-4 z-20 flex h-[46vh] flex-col overflow-hidden border border-zinc-800 brand-card radius-panel shadow-2xl shadow-black/40 backdrop-blur-md md:left-auto md:top-4 md:right-4 md:bottom-4 md:h-auto md:w-[360px] md:max-w-[calc(100%-2rem)] xl:w-[380px]"
>
<div className="flex items-center justify-between px-4 py-3 border-b border-zinc-800">
<div className="min-w-0">
@@ -1189,7 +1189,7 @@ const Subagents: React.FC = () => {
setStreamTask(null);
setStreamItems([]);
}}
className="px-2 py-1 rounded-xl bg-zinc-800 hover:bg-zinc-700 text-[11px] text-zinc-200"
className="px-2 py-1 rounded-xl text-[11px] control-chip"
>
{t('close')}
</button>