iod/AgentCoord
10
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:智能体详情添加

Browse Source
This commit is contained in:
liailing1026
2026-02-27 10:25:44 +08:00
parent 2140cfaf92
commit dad1ac2e51
12 changed files with 136 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
frontend/src/layout/components/Main/TaskTemplate/AgentRepo/AgentRepoList.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { computed } from 'vue'
import { computed, reactive } from 'vue'
import { getActionTypeDisplay, getAgentMapIcon } from '@/layout/components/config.ts'
import SvgIcon from '@/components/SvgIcon/index.vue'
import { type Agent, useAgentsStore } from '@/stores'
@@ -9,6 +9,20 @@ const porps = defineProps<{
agentList: Agent[]
}>()
// 每个智能体的标签状态
const tabState = reactive<Record<string, 'duty' | 'info'>>({})
const getTabState = (agentName: string) => {
if (!tabState[agentName]) {
tabState[agentName] = 'duty' // 默认显示"当前职责"
}
return tabState[agentName]
}
const setTabState = (agentName: string, tab: 'duty' | 'info') => {
tabState[agentName] = tab
}
const taskProcess = computed(() => {
const list = agentsStore.currentTask?.TaskProcess ?? []
return list.map(item => ({
@@ -70,37 +84,75 @@ const agentsStore = useAgentsStore()
<div class="duty-info">
<div class="w-full flex justify-center">
<div
class="rounded-[9px] bg-[var(--color-bg-quaternary)] text-[12px] py-0.5 px-5 text-center my-2"
class="rounded-[9px] text-[12px] py-0.5 px-5 text-center my-2 cursor-pointer transition-colors"
:class="
getTabState(item.Name) === 'info'
? 'bg-[var(--color-tab-bg-active)]'
: 'bg-[var(--color-tab-bg)]'
"
:style="{
color:
getTabState(item.Name) === 'info'
? 'var(--color-tab-text)'
: 'var(--color-tab-text-inactive)'
}"
@click="setTabState(item.Name, 'info')"
>
信息描述
</div>
<div
class="rounded-[9px] text-[12px] py-0.5 px-5 text-center my-2 cursor-pointer transition-colors"
:class="
getTabState(item.Name) === 'duty'
? 'bg-[var(--color-tab-bg-active)]'
: 'bg-[var(--color-tab-bg)]'
"
:style="{
color:
getTabState(item.Name) === 'duty'
? 'var(--color-tab-text)'
: 'var(--color-tab-text-inactive)'
}"
@click="setTabState(item.Name, 'duty')"
>
当前职责
</div>
</div>
<div class="p-[8px] pt-0">
<div
v-for="(item1, index1) in taskProcess.filter(i => i.AgentName === item.Name)"
:key="item1.key"
class="text-[12px]"
>
<div>
<div class="mx-1 inline-block h-[14px]">
<div
:style="{ background: getActionTypeDisplay(item1.ActionType)?.color }"
class="w-[6px] h-[6px] rounded-full mt-[7px]"
></div>
</div>
<span :style="{ color: getActionTypeDisplay(item1.ActionType)?.color }"
>{{ getActionTypeDisplay(item1.ActionType)?.name }}：</span
>
<span>{{ item1.Description }}</span>
<!-- 信息描述 -->
<template v-if="getTabState(item.Name) === 'info'">
<div class="text-[12px] text-[var(--color-text-detail)]">
{{ item.Profile }}
</div>
<!-- 分割线 -->
</template>
<!-- 当前职责 -->
<template v-else>
<div
v-if="index1 !== taskProcess.filter(i => i.AgentName === item.Name).length - 1"
class="h-[1px] w-full bg-[var(--color-border-default)] my-[8px]"
></div>
v-for="(item1, index1) in taskProcess.filter(i => i.AgentName === item.Name)"
:key="item1.key"
class="text-[12px]"
>
<div>
<div class="mx-1 inline-block h-[14px]">
<div
:style="{ background: getActionTypeDisplay(item1.ActionType)?.color }"
class="w-[6px] h-[6px] rounded-full mt-[7px]"
></div>
</div>
<span :style="{ color: getActionTypeDisplay(item1.ActionType)?.color }"
>{{ getActionTypeDisplay(item1.ActionType)?.name }}：</span
>
<span>{{ item1.Description }}</span>
</div>
<!-- 分割线 -->
<div
v-if="index1 !== taskProcess.filter(i => i.AgentName === item.Name).length - 1"
class="h-[1px] w-full bg-[var(--color-border-default)] my-[8px]"
></div>
<AssignmentButton />
</div>
<AssignmentButton />
</div>
</template>
</div>
</div>
</div>