feat:三个浮动窗口功能新增

This commit is contained in:
liailing1026
2025-12-31 19:04:58 +08:00
parent d42554ce03
commit 5847365eee
34 changed files with 7471 additions and 647 deletions

View File

@@ -20,7 +20,11 @@ const emit = defineEmits<{
const agentsStore = useAgentsStore()
const drawerVisible = ref(false)
const collaborationProcess = computed(() => {
return agentsStore.agentRawPlan.data?.['Collaboration Process'] ?? []
const data = agentsStore.agentRawPlan.data?.['Collaboration Process'] ?? []
// console.log('data:', data)
return data
// return agentsStore.agentRawPlan.data?.['Collaboration Process'] ?? []
})
// 监听额外产物变化
@@ -319,7 +323,7 @@ defineExpose({
:class="{ 'is-running': agentsStore.executePlan.length > 0 }"
>
<!-- 标题与执行按钮 -->
<div class="text-[18px] font-bold mb-[18px] flex justify-between items-center px-[20px]">
<div class="text-[18px] font-bold mb-[7px] flex justify-between items-center px-[20px]">
<span class="text-[var(--color-text-title-header)]">执行结果</span>
<div
class="flex items-center justify-end gap-[14px] task-button-group min-w-[175px]"
@@ -332,6 +336,7 @@ defineExpose({
:title="processBtnTitle"
@mouseenter="handleProcessMouseEnter"
@click="handleTaskProcess"
style="order: 1"
>
<svg-icon icon-class="process" />
<span v-if="showProcessText" class="btn-text">任务过程</span>
@@ -343,6 +348,7 @@ defineExpose({
title="请先输入要执行的任务"
:visible="showPopover"
@hide="showPopover = false"
style="order: 2"
>
<template #reference>
<el-button
@@ -393,7 +399,7 @@ defineExpose({
<!-- 内容 -->
<div
v-loading="agentsStore.agentRawPlan.loading"
class="flex-1 overflow-auto relative"
class="flex-1 overflow-auto relative ml-[20px] mr-[20px]"
@scroll="handleScroll"
>
<div id="task-results-main" class="px-[40px] relative">
@@ -580,7 +586,7 @@ defineExpose({
.card-item {
background: var(--color-bg-detail);
padding: 25px;
padding: 5px;
padding-top: 10px;
border-radius: 7px;
}
@@ -668,6 +674,8 @@ defineExpose({
// ========== 新增:按钮交互样式 ==========
.task-button-group {
display: flex;
flex-direction: row-reverse;
.el-button {
display: inline-flex !important;
align-items: center !important;
@@ -679,6 +687,10 @@ defineExpose({
color: var(--color-text-primary) !important;
position: relative;
background-color: var(--color-bg-tertiary);
gap: 0px !important;
outline: none !important;
box-shadow: none !important;
-webkit-tap-highlight-color: transparent !important;
&:hover {
transform: translateY(-2px) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
@@ -717,25 +729,58 @@ defineExpose({
padding: 0 16px !important;
gap: 8px;
.btn-text {
display: inline-block !important;
font-size: 14px;
font-weight: 500;
margin-left: 4px;
// 任务过程按钮 - 左边固定,向右展开
&:nth-child(1) {
justify-content: flex-start !important;
.btn-text {
display: inline-block !important;
font-size: 14px;
font-weight: 500;
margin-right: 8px;
margin-left: 0;
opacity: 1;
animation: fadeInLeft 0.3s ease forwards;
}
}
// 任务执行按钮 - 右边固定,向左展开
&:nth-child(2) {
justify-content: flex-end !important;
.btn-text {
display: inline-block !important;
font-size: 14px;
font-weight: 500;
margin-left: 8px;
margin-right: 0;
opacity: 1;
animation: fadeInRight 0.3s ease forwards;
}
}
// .btn-text {
// display: inline-block !important;
// font-size: 14px;
// font-weight: 500;
// margin-left: 4px;
// opacity: 1;
// animation: fadeIn 0.3s ease forwards;
// }
}
@keyframes fadeInLeft {
from {
opacity: 0;
transform: translateX(5px);
}
to {
opacity: 1;
animation: fadeIn 0.3s ease forwards;
transform: translateX(0);
}
}
.btn-text {
font-size: 14px;
font-weight: 500;
margin-left: 4px;
opacity: 0;
animation: fadeIn 0.3s ease forwards;
}
@keyframes fadeIn {
@keyframes fadeInRight {
from {
opacity: 0;
transform: translateX(-5px);