kris/ForcePilot
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(web): 优化智能体管理分组展示

Browse Source
This commit is contained in:
Wenjie Zhang 2026-06-05 21:02:13 +08:00
parent b991d4d75d
commit 07137be6db
2 changed files with 104 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/components/common/MarkdownPreview.vue
View File

@ -240,11 +240,11 @@ const showCopiedFeedback = (btn) => {
cite { cite {
position: relative; position: relative;
margin-left: 4px; margin: 0 4px;
padding: 0 0.25rem; padding: 0 0.25rem;
border-radius: 4px; border-radius: 4px;
outline: 2px solid var(--gray-200); outline: 2px solid var(--gray-100);
background-color: var(--gray-200); background-color: var(--gray-100);
color: var(--gray-800); color: var(--gray-800);
font-size: 12px; font-size: 12px;
font-style: normal; font-style: normal;

155
web/src/components/model-management/AgentManagePanel.vue
View File

@ -103,6 +103,15 @@ const filteredAgents = computed(() => {
}) })
}) })
const groupedAgents = computed(() => {
const agents = filteredAgents.value.filter((agent) => !agent.is_subagent)
const subagents = filteredAgents.value.filter((agent) => agent.is_subagent)
return [
{ key: 'agents', title: '智能体', agents },
{ key: 'subagents', title: '子智能体', agents: subagents }
].filter((group) => group.agents.length > 0)
})
const agentStats = computed(() => ({ const agentStats = computed(() => ({
total: managedAgents.value.length, total: managedAgents.value.length,
builtin: managedAgents.value.filter(isBuiltinAgent).length, builtin: managedAgents.value.filter(isBuiltinAgent).length,
@ -394,62 +403,76 @@ defineExpose({
</template> </template>
</PageShoulder> </PageShoulder>
<ExtensionCardGrid :min-width="320"> <div v-if="groupedAgents.length === 0" class="agent-empty-state">
<InfoCard <a-empty :image="false" :description="searchQuery ? '没有匹配的智能体' : '暂无智能体'" />
v-for="agent in filteredAgents" </div>
:key="agent.id"
:title="agent.name"
:subtitle="agent.slug || agent.id"
:description="agent.description || '暂无描述'"
:default-icon="Bot"
:tags="getAgentTags(agent)"
class="config-card agent-card"
@click="canManageAgent(agent) && openEditAgentModal(agent)"
>
<template #icon>
<img
v-if="getAgentIconSrc(agent)"
class="agent-card-icon-image"
:src="getAgentIconSrc(agent)"
:alt="`${agent.name || '智能体'}图标`"
/>
</template>
<template #status> <template v-else>
<a-dropdown v-if="canManageAgent(agent)" :trigger="['click']" placement="bottomRight"> <section v-for="group in groupedAgents" :key="group.key" class="agent-group-section">
<template #overlay> <div class="agent-group-header">
<a-menu> <span>{{ group.title }}</span>
<a-menu-item key="edit" @click.stop="openEditAgentModal(agent)"> </div>
<span class="agent-card-menu-item"> <ExtensionCardGrid :min-width="320">
<Edit3 :size="14" /> <InfoCard
编辑智能体 v-for="agent in group.agents"
</span> :key="agent.id"
</a-menu-item> :title="agent.name"
<a-menu-item :subtitle="agent.slug || agent.id"
key="delete" :description="agent.description || '暂无描述'"
:disabled="isBuiltinAgent(agent)" :default-icon="Bot"
@click.stop="deleteAgent(agent)" :tags="getAgentTags(agent)"
> class="config-card agent-card"
<span class="agent-card-menu-item" :class="{ danger: !isBuiltinAgent(agent) }"> @click="canManageAgent(agent) && openEditAgentModal(agent)"
<Trash2 :size="14" /> >
删除智能体 <template #icon>
</span> <img
</a-menu-item> v-if="getAgentIconSrc(agent)"
</a-menu> class="agent-card-icon-image"
:src="getAgentIconSrc(agent)"
:alt="`${agent.name || '智能体'}图标`"
/>
</template> </template>
<a-button
type="text" <template #status>
size="small" <a-dropdown v-if="canManageAgent(agent)" :trigger="['click']" placement="bottomRight">
class="agent-card-menu-trigger" <template #overlay>
aria-label="智能体操作" <a-menu>
@click.stop <a-menu-item key="edit" @click.stop="openEditAgentModal(agent)">
> <span class="agent-card-menu-item">
<MoreVertical :size="16" /> <Edit3 :size="14" />
</a-button> 编辑智能体
</a-dropdown> </span>
</template> </a-menu-item>
</InfoCard> <a-menu-item
</ExtensionCardGrid> key="delete"
:disabled="isBuiltinAgent(agent)"
@click.stop="deleteAgent(agent)"
>
<span
class="agent-card-menu-item"
:class="{ danger: !isBuiltinAgent(agent) }"
>
<Trash2 :size="14" />
删除智能体
</span>
</a-menu-item>
</a-menu>
</template>
<a-button
type="text"
size="small"
class="agent-card-menu-trigger"
aria-label="智能体操作"
@click.stop
>
<MoreVertical :size="16" />
</a-button>
</a-dropdown>
</template>
</InfoCard>
</ExtensionCardGrid>
</section>
</template>
<!-- Agent Edit Modal --> <!-- Agent Edit Modal -->
<a-modal <a-modal
@ -617,6 +640,30 @@ defineExpose({
min-height: 0; min-height: 0;
} }
.agent-empty-state {
display: flex;
align-items: center;
justify-content: center;
padding: 100px 20px;
text-align: center;
}
.agent-group-section + .agent-group-section {
padding-top: 2px;
}
.agent-group-header {
display: flex;
align-items: center;
gap: 8px;
padding: 12px var(--page-padding) 0;
color: var(--gray-500);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.4px;
line-height: 18px;
}
.agent-card-icon-image { .agent-card-icon-image {
display: block; display: block;
width: 100%; width: 100%;