- 
- {{ configStore.config.title }}{{ configStore.config.subTitle }}
-
-
- {{ configStore.config.title }}{{ configStore.config.subTitle }}
-
- {{ configStore.config.centerTitle }}
-
+
+
+
+
diff --git a/frontend/src/layout/components/Main/Task.vue b/frontend/src/layout/components/Main/Task.vue
index 0a5aaa2..c97dbcd 100644
--- a/frontend/src/layout/components/Main/Task.vue
+++ b/frontend/src/layout/components/Main/Task.vue
@@ -1,11 +1,14 @@
@@ -67,8 +125,13 @@ const taskContainerRef = ref
+ 
+
+ 数联网多智能体协同平台 +
+
- (null)
margin: 0 auto;
border: 2px solid transparent;
$bg: var(--el-input-bg-color, var(--el-fill-color-blank));
- background:
- linear-gradient(var(--color-bg-tertiary), var(--color-bg-tertiary)) padding-box,
+ background: linear-gradient(var(--color-bg-taskbar), var(--color-bg-taskbar)) padding-box,
linear-gradient(to right, #00c8d2, #315ab4) border-box;
- border-radius: 40px;
+ border-radius: 30px;
position: absolute;
left: 50%;
transform: translateX(-50%);
@@ -131,28 +210,35 @@ const taskContainerRef = ref(null)
min-height: 100%;
overflow: hidden;
padding: 0 55px 0 47px;
+ transition: all 0.3s ease;
+
+ /* 搜索框展开时的样式 */
+ &.expanded {
+ box-shadow: var(--color-task-shadow);
+ }
:deep(.el-popper) {
position: static !important;
- width: 100%;
- min-width: 100%;
- background: var(--color-bg-tertiary);
- box-shadow: none;
+ width: calc(100% + 102px); /*增加左右padding的总和 */
+ min-width: calc(100% + 102px); /* 确保最小宽度也增加 */
+ margin-left: -47px; /* 向左偏移左padding的值 */
+ margin-right: -55px; /*向右偏移右padding的值 */
+ background: var(--color-bg-taskbar);
border: none;
transition: height 0s ease-in-out;
- border-top: 1px solid #494B51;
+ border-top: 1px solid var(--color-border);
border-radius: 0;
-
li {
height: 45px;
box-sizing: border-box;
line-height: 45px;
font-size: 14px;
+ padding-left: 27px;
&:hover {
- background: #1C1E25;
- color: #00F3FF;
+ background: var(--color-bg-hover);
+ color: var(--color-text-hover);
}
}
@@ -166,7 +252,7 @@ const taskContainerRef = ref(null)
width: 100%;
.task-input {
- height: 100%;
+ height: 100%;
}
.el-textarea__inner {
@@ -175,8 +261,9 @@ const taskContainerRef = ref(null)
font-size: 14px;
height: 100%;
line-height: 1.5;
- padding: 18px 0;
+ padding: 18px 0 0 18px;
resize: none;
+ color: var(--color-text-taskbar);
&::placeholder {
line-height: 1.2;
@@ -192,11 +279,10 @@ const taskContainerRef = ref(null)
}
}
-
.task-title {
position: absolute;
top: 28px;
- left: 10px;
+ left: 27px;
z-index: 999;
transform: translateY(-50%);
}
@@ -221,4 +307,121 @@ const taskContainerRef = ref(null)
}
}
}
+
+.drawer-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+ .title {
+ font-size: 18px;
+ font-weight: bold;
+ }
+}
+
+.process-list {
+ padding: 0 8px;
+}
+.process-item {
+ margin-bottom: 16px;
+ padding: 12px;
+ border-radius: 8px;
+ background: var(--color-bg-list);
+ border: 1px solid var(--color-border-default);
+
+ .process-content {
+ display: flex;
+ align-items: flex-start;
+ gap: 8px;
+
+ .agent-tag {
+ display: inline-block;
+ padding: 4px 8px;
+ border-radius: 4px;
+ font-size: 14px;
+ font-weight: 500;
+ white-space: nowrap;
+ flex-shrink: 0;
+ }
+
+ .process-text {
+ line-height: 1.6;
+ font-size: 14px;
+ color: var(--el-text-color-primary);
+ white-space: pre-wrap;
+ }
+ }
+
+ .edit-container {
+ margin-top: 8px;
+ }
+}
+
+.process-item:hover {
+ border-color: var(--el-border-color);
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.agent-allocation-entry {
+ position: absolute;
+ right: 0; /* 顶头 */
+ top: 0;
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ background: #00aaff; /* 纯蓝色背景 */
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ box-shadow: 0 2px 6px rgba(0, 170, 255, 0.35);
+ transition: transform 0.2s;
+
+ &:hover {
+ transform: scale(1.08);
+ }
+ &:active {
+ transform: scale(0.96);
+ }
+}
+
+// 智能体分配弹窗样式
+:deep(.agent-allocation-dialog) {
+ .el-dialog {
+ border-radius: 12px;
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
+
+ &__header {
+ padding: 16px 20px;
+ border-bottom: 1px solid var(--color-border);
+ margin-right: 0;
+
+ .el-dialog__title {
+ font-size: 18px;
+ font-weight: bold;
+ color: var(--color-text-title);
+ }
+ }
+
+ &__body {
+ padding: 0;
+ max-height: 70vh;
+ overflow: hidden;
+ }
+
+ &__headerbtn {
+ top: 16px;
+ right: 20px;
+
+ .el-dialog__close {
+ color: var(--color-text);
+ font-size: 16px;
+
+ &:hover {
+ color: var(--color-primary);
+ }
+ }
+ }
+ }
+}
diff --git a/frontend/src/layout/components/Main/TaskTemplate/AgentRepo/AgentRepoList.vue b/frontend/src/layout/components/Main/TaskTemplate/AgentRepo/AgentRepoList.vue
index 465f8c2..4c6de87 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/AgentRepo/AgentRepoList.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/AgentRepo/AgentRepoList.vue
@@ -1,4 +1,5 @@
@@ -126,7 +126,7 @@ const agentList = computed(() => {
- 任务
+
+
@@ -120,10 +200,9 @@ const taskContainerRef = ref
+ 任务
(null)
:disabled="!(agentsStore.agents.length > 0)"
:debounce="0"
:trigger-on-focus="triggerOnFocus"
- @focus="isFocus = true"
- @blur="isFocus = false"
+ @focus="handleFocus"
+ @blur="handleBlur"
@select="isFocus = false"
>
@@ -101,10 +164,27 @@ const taskContainerRef = ref(null)
v-if="!agentsStore.agentRawPlan.loading"
icon-class="paper-plane"
size="18px"
- color="var(--color-text)"
+ color="#ffffff"
/>
+
+
+
+
+
- 智能体库
+ 智能体库
-
+
@@ -162,7 +170,7 @@ const agentList = computed(() => {
padding: 0 8px;
.plus-button {
- background: #1d2128;
+ background: var(--color-bg-tertiary);
width: 24px;
height: 24px;
padding: 0;
@@ -174,7 +182,7 @@ const agentList = computed(() => {
transition: all 0.3s ease;
&:hover {
- background: #374151;
+ background: var(--color-bg-quaternary);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}
}
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskProcess/ProcessCard.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskProcess/ProcessCard.vue
new file mode 100644
index 0000000..3ca8177
--- /dev/null
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskProcess/ProcessCard.vue
@@ -0,0 +1,283 @@
+
+
+
+
+
{{ item.name }}
-
+
+
+
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskResult/ExecutePlan.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskResult/ExecutePlan.vue
index 9823d72..1f40c70 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/TaskResult/ExecutePlan.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskResult/ExecutePlan.vue
@@ -15,16 +15,14 @@ const md = new MarkdownIt({
html: true,
linkify: true,
typographer: true,
- breaks: true,
+ breaks: true
})
function sanitize(str?: string) {
if (!str) {
return ''
}
- const cleanStr = str
- .replace(/\\n/g, '\n')
- .replace(/\n\s*\d+\./g, '\n$&')
+ const cleanStr = str.replace(/\\n/g, '\n').replace(/\n\s*\d+\./g, '\n$&')
const html = md.render(cleanStr)
return html
// return DOMPurify.sanitize(html)
@@ -43,7 +41,7 @@ const data = computed(() => {
return {
Description: props.nodeId,
Content: sanitize(result.content),
- LogNodeType: result.LogNodeType,
+ LogNodeType: result.LogNodeType
}
}
@@ -56,7 +54,7 @@ const data = computed(() => {
return {
Description: action.Description,
Content: sanitize(action.Action_Result),
- LogNodeType: result.LogNodeType,
+ LogNodeType: result.LogNodeType
}
}
}
@@ -75,9 +73,11 @@ const data = computed(() => {
class="text-[16px] flex items-center gap-1 text-[var(--color-text-secondary)] mb-1"
>
{{ data.Description }}
-
+
+
+
+
+
+ {{ process.AgentName }}
+
+
+
+
+
+
+
+
+
+ {{ process.Description }}
+
+
+ 。
+
+
+
+
+
import { readConfig } from '@/utils/readJson.ts'
-import { onMounted } from 'vue'
+import { ref, computed, onMounted } from 'vue'
interface Iod {
name: string
@@ -28,10 +28,22 @@ function handleNext() {
displayIndex.value++
}
}
+
+function handlePrev() {
+ if (displayIndex.value === 0) {
+ displayIndex.value = data.value.length - 1
+ } else {
+ displayIndex.value--
+ }
+}
-
+
-
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index copy.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index copy.vue
new file mode 100644
index 0000000..af731bd
--- /dev/null
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index copy.vue
@@ -0,0 +1,861 @@
+
+
+
+ >({}) //行级编辑状态
+const editBuffer = reactive>({}) //临时输入
+
+function getProcessDescription(stepId: string, processId: string) {
+ const step = collaborationProcess.value.find(s => s.Id === stepId)
+ if (step) {
+ const process = step.TaskProcess.find(p => p.ID === processId)
+ return process?.Description || ''
+ }
+ return ''
+}
+
+function save() {
+ Object.keys(editMap).forEach(key => {
+ if (editMap[key]) {
+ const [stepId, processId] = key.split('-')
+ const value = editBuffer[key]
+ // 确保 value 是字符串类型
+ if (value !== undefined && value !== null) {
+ // @ts-ignore - TypeScript 无法正确推断类型，但运行时是安全的
+ handleSaveEdit(stepId, processId, value)
+ }
+ }
+ })
+ editMode.value = false
+}
+
+function handleOpenEdit(stepId: string, processId: string) {
+ if (!editMode.value) return
+ const key = `${stepId}-${processId}`
+ editMap[key] = true
+ editBuffer[key] = getProcessDescription(stepId, processId)
+}
+
+function handleSaveEdit(stepId: string, processId: string, value: string) {
+ const key = `${stepId}-${processId}`
+ const step = collaborationProcess.value.find(s => s.Id === stepId)
+ if (step) {
+ const process = step.TaskProcess.find(p => p.ID === processId)
+ if (process) {
+ process.Description = value
+ }
+ }
+ editMap[key] = false
+ ElMessage.success('已保存（前端内存）')
+}
const jsplumb = new Jsplumb('task-results-main', {
connector: {
type: BezierConnector.type,
- options: { curviness: 30, stub: 10 },
- },
+ options: { curviness: 30, stub: 10 }
+ }
})
// 操作折叠面板时要实时的刷新连线
-let timer: number
+let timer: ReturnType | null = null
function handleCollapse() {
if (timer) {
clearInterval(timer)
@@ -40,11 +87,14 @@ function handleCollapse() {
timer = setInterval(() => {
jsplumb.repaintEverything()
emit('refreshLine')
- }, 1)
+ }, 1) as ReturnType
// 默认三秒后已经完全打开
const timer1 = setTimeout(() => {
- clearInterval(timer)
+ if (timer) {
+ clearInterval(timer)
+ timer = null
+ }
}, 3000)
onUnmounted(() => {
@@ -61,14 +111,14 @@ function handleCollapse() {
function createInternalLine(id?: string) {
const arr: ConnectArg[] = []
jsplumb.reset()
- collaborationProcess.value.forEach((item) => {
+ collaborationProcess.value.forEach(item => {
// 创建左侧流程与产出的连线
arr.push({
sourceId: `task-results-${item.Id}-0`,
targetId: `task-results-${item.Id}-1`,
- anchor: [AnchorLocations.Left, AnchorLocations.Left],
+ anchor: [AnchorLocations.Left, AnchorLocations.Left]
})
- collaborationProcess.value.forEach((jitem) => {
+ collaborationProcess.value.forEach(jitem => {
// 创建左侧产出与上一步流程的连线
if (item.InputObject_List!.includes(jitem.OutputObject ?? '')) {
arr.push({
@@ -76,12 +126,12 @@ function createInternalLine(id?: string) {
targetId: `task-results-${item.Id}-0`,
anchor: [AnchorLocations.Left, AnchorLocations.Left],
config: {
- type: 'output',
- },
+ type: 'output'
+ }
})
}
// 创建右侧任务程序与InputObject字段的连线
- jitem.TaskProcess.forEach((i) => {
+ jitem.TaskProcess.forEach(i => {
if (i.ImportantInput?.includes(`InputObject:${item.OutputObject}`)) {
const color = getActionTypeDisplay(i.ActionType)?.color ?? ''
const sourceId = `task-results-${item.Id}-1`
@@ -93,21 +143,21 @@ function createInternalLine(id?: string) {
config: {
stops: [
[0, color],
- [1, color],
+ [1, color]
],
- transparent: targetId !== id,
- },
+ transparent: targetId !== id
+ }
})
}
})
})
// 创建右侧TaskProcess内部连线
- item.TaskProcess?.forEach((i) => {
+ item.TaskProcess?.forEach(i => {
if (!i.ImportantInput?.length) {
return
}
- item.TaskProcess?.forEach((i2) => {
+ item.TaskProcess?.forEach(i2 => {
if (i.ImportantInput.includes(`ActionResult:${i2.ID}`)) {
const color = getActionTypeDisplay(i.ActionType)?.color ?? ''
const sourceId = `task-results-${item.Id}-0-${i2.ID}`
@@ -119,10 +169,10 @@ function createInternalLine(id?: string) {
config: {
stops: [
[0, color],
- [1, color],
+ [1, color]
],
- transparent: targetId !== id,
- },
+ transparent: targetId !== id
+ }
})
}
})
@@ -134,6 +184,14 @@ function createInternalLine(id?: string) {
}
const loading = ref(false)
+
+// 额外产物编辑状态
+const editingOutputId = ref(null)
+const editingOutputContent = ref('')
+
+// 额外产物内容存储
+const additionalOutputContents = ref>({})
+
async function handleRun() {
try {
loading.value = true
@@ -144,9 +202,51 @@ async function handleRun() {
}
}
+// 查看任务过程
+async function handleTaskProcess() {
+ drawerVisible.value = true
+}
+
+// 开始编辑额外产物内容
+function startOutputEditing(output: string) {
+ editingOutputId.value = output
+ editingOutputContent.value = getAdditionalOutputContent(output) || ''
+}
+
+// 保存额外产物内容
+function saveOutputEditing() {
+ if (editingOutputId.value && editingOutputContent.value.trim()) {
+ additionalOutputContents.value[editingOutputId.value] = editingOutputContent.value.trim()
+ }
+ editingOutputId.value = null
+ editingOutputContent.value = ''
+}
+
+// 取消编辑额外产物内容
+function cancelOutputEditing() {
+ editingOutputId.value = null
+ editingOutputContent.value = ''
+}
+
+// 获取额外产物内容
+function getAdditionalOutputContent(output: string) {
+ return additionalOutputContents.value[output] || ''
+}
+
+// 处理额外产物的键盘事件
+function handleOutputKeydown(event: KeyboardEvent) {
+ if (event.key === 'Enter') {
+ event.preventDefault()
+ saveOutputEditing()
+ } else if (event.key === 'Escape') {
+ editingOutputId.value = null
+ editingOutputContent.value = ''
+ }
+}
+
// 添加滚动状态标识
const isScrolling = ref(false)
-let scrollTimer: number
+let scrollTimer: ReturnType | null = null
// 修改滚动处理函数
function handleScroll() {
@@ -161,11 +261,11 @@ function handleScroll() {
// 设置滚动结束检测
scrollTimer = setTimeout(() => {
isScrolling.value = false
- }, 300)
+ }, 300) as ReturnType
}
// 修改鼠标事件处理函数
-const handleMouseEnter = throttle((id) => {
+const handleMouseEnter = throttle(id => {
if (!isScrolling.value) {
createInternalLine(id)
}
@@ -181,34 +281,160 @@ function clear() {
jsplumb.reset()
}
+// ========== 按钮交互状态管理 ==========
+const buttonHoverState = ref<'process' | 'execute' | null>(null)
+let buttonHoverTimer: ReturnType | null = null
+const handleProcessMouseEnter = () => {
+ if (buttonHoverTimer) {
+ clearTimeout(buttonHoverTimer)
+ buttonHoverTimer = null
+ }
+ buttonHoverState.value = 'process'
+}
+
+const handleExecuteMouseEnter = () => {
+ if (buttonHoverTimer) {
+ clearTimeout(buttonHoverTimer)
+ buttonHoverTimer = null
+ }
+ if (agentsStore.agentRawPlan.data) {
+ buttonHoverState.value = 'execute'
+ }
+}
+
+const handleButtonMouseLeave = () => {
+ // 添加防抖，防止快速切换时的抖动
+ if (buttonHoverTimer) {
+ clearTimeout(buttonHoverTimer)
+ }
+ buttonHoverTimer = setTimeout(() => {
+ buttonHoverState.value = null
+ }, 50) // 适当减少延迟时间
+}
+
+// 添加离开组件时的清理
+onUnmounted(() => {
+ if (buttonHoverTimer) {
+ clearTimeout(buttonHoverTimer)
+ }
+})
+// 计算按钮类名
+const processBtnClass = computed(() => {
+ return buttonHoverState.value === 'process' ? 'ellipse' : 'circle'
+})
+
+const executeBtnClass = computed(() => {
+ // 鼠标悬停在过程按钮上时，执行按钮变圆形
+ if (buttonHoverState.value === 'process') {
+ return 'circle'
+ }
+ // 其他情况：如果有任务数据就显示椭圆形，否则显示圆形
+ return agentsStore.agentRawPlan.data ? 'ellipse' : 'circle'
+})
+
+// 计算按钮是否显示文字
+const showProcessText = computed(() => {
+ return buttonHoverState.value === 'process'
+})
+
+const showExecuteText = computed(() => {
+ // 鼠标悬停在过程按钮上时，执行按钮不显示文字
+ if (buttonHoverState.value === 'process') return false
+ // 其他情况：如果有任务数据就显示文字，否则不显示
+ return agentsStore.agentRawPlan.data
+})
+
+// 计算按钮标题
+const processBtnTitle = computed(() => {
+ return buttonHoverState.value === 'process' ? '任务过程' : '点击查看任务过程'
+})
+
+const executeBtnTitle = computed(() => {
+ return showExecuteText.value ? '任务执行' : '点击运行'
+})
+
defineExpose({
createInternalLine,
- clear,
+ clear
})
-
数联网搜索结果
-
- 下一个
+
+
+
{{ `${displayIndex + 1}/${data.length}` }}
-
-
+
-
- 名称:
- {{ displayIod.name }}
-
-
- 数据空间:
- {{ displayIod.data_space }}
-
-
- DOID:
- {{ displayIod.doId }}
-
-
- 来源仓库:
- {{ displayIod.fromRepo }}
-
+
+
+ 名称:
+
+ {{ displayIod.name }}
+
+
+
+ 数据空间:
+
+ {{ displayIod.data_space }}
+
+
+
+ DOID:
+
+ {{ displayIod.doId }}
+
+
+
+ 来源仓库:
+
+ {{ displayIod.fromRepo }}
+
+
+
+
+
+
+ {{ `${displayIndex + 1}/${data.length}` }}
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index.vue
index 9e8acb1..1d8e1b5 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskResult/index.vue
@@ -9,7 +9,7 @@ import { type ConnectArg, Jsplumb } from '@/layout/components/Main/TaskTemplate/
import variables from '@/styles/variables.module.scss'
import { type IRawStepTask, useAgentsStore } from '@/stores'
import api from '@/api'
-
+import ProcessCard from '../TaskProcess/ProcessCard.vue'
import ExecutePlan from './ExecutePlan.vue'
const emit = defineEmits<{
@@ -18,21 +18,68 @@ const emit = defineEmits<{
}>()
const agentsStore = useAgentsStore()
-
-
+const drawerVisible = ref(false)
const collaborationProcess = computed(() => {
return agentsStore.agentRawPlan.data?.['Collaboration Process'] ?? []
})
+// 编辑逻辑
+const editMode = ref(false) //全局编辑开关
+const editMap = reactive
+ 执行结果
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.StepName }}
+
+
+
+
+
+
+
+
+
+ {{ item1.AgentName }}:
+
+ {{ getActionTypeDisplay(item1.ActionType)?.name }}
+
+
+ {{ item.OutputObject }}
+
+
+
+
+
+
+
+
+
+
+
+ {{ output }}
+
+
+
+
+
+
+
+
+
+
+
+
+ √
+
+
+ ×
+
+
+
+
+
+
+
+
+
+
+ {{ getAdditionalOutputContent(output) || '暂无内容，点击编辑' }}
+
+
+
- 执行结果
-
-
-
@@ -218,11 +444,12 @@ defineExpose({
@scroll="handleScroll"
>
+
@@ -244,7 +471,14 @@ defineExpose({
-
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/Bg.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/Bg.vue
index e6b0a2a..87fdc19 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/Bg.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/Bg.vue
@@ -1,31 +1,26 @@
+
+
- {{ item1.AgentName }}:
+ {{ item1.AgentName }}:
{{ getActionTypeDisplay(item1.ActionType)?.name }}
@@ -279,7 +520,7 @@ defineExpose({
-
+
+
+ {{ item.OutputObject }}
+
+ {{ item.OutputObject }}
+
-
+
+
+
+
+
+
+
+
+ {{ output }}
+
+
+
+
+
+
+
+
+
+
+
+
+ √
+
+
+ ×
+
+
+
+
+
+
+
+
+
+
+ {{ getAdditionalOutputContent(output) || '暂无内容，点击编辑' }}
+
+
-
+
- (null)
+const editingContent = ref('')
+
+// 添加新产物状态管理
+const showAddOutputForm = ref(false)
+const newOutputName = ref('')
+
+// 开始编辑
+const startEditing = (task: IRawStepTask) => {
+ if (!task.Id) {
+ console.warn('Task ID is missing, cannot start editing')
+ return
+ }
+ editingTaskId.value = task.Id
+ editingContent.value = task.TaskContent || ''
+}
+
+// 保存编辑
+const saveEditing = () => {
+ if (editingTaskId.value && editingContent.value.trim()) {
+ const taskToUpdate = collaborationProcess.value.find(item => item.Id === editingTaskId.value)
+ if (taskToUpdate) {
+ taskToUpdate.TaskContent = editingContent.value.trim()
+ }
+ }
+ editingTaskId.value = null
+ editingContent.value = ''
+}
+
+// 取消编辑
+const cancelEditing = () => {
+ editingTaskId.value = null
+ editingContent.value = ''
+}
+
+// 处理键盘事件
+const handleKeydown = (event: KeyboardEvent) => {
+ if (event.key === 'Enter') {
+ event.preventDefault()
+ saveEditing()
+ } else if (event.key === 'Escape') {
+ cancelEditing()
+ }
+}
+
+// 显示添加产物表单
+const showAddOutputDialog = () => {
+ showAddOutputForm.value = true
+ newOutputName.value = ''
+}
+
+// 添加新产物
+const addNewOutput = () => {
+ if (newOutputName.value.trim()) {
+ const success = agentsStore.addNewOutput(newOutputName.value.trim())
+ if (success) {
+ showAddOutputForm.value = false
+ newOutputName.value = ''
+ }
+ }
+}
+
+// 取消添加产物
+const cancelAddOutput = () => {
+ showAddOutputForm.value = false
+ newOutputName.value = ''
+}
+
+// 处理添加产物的键盘事件
+const handleAddOutputKeydown = (event: KeyboardEvent) => {
+ if (event.key === 'Enter') {
+ event.preventDefault()
+ addNewOutput()
+ } else if (event.key === 'Escape') {
+ cancelAddOutput()
+ }
+}
+
+// 删除额外产物
+const removeAdditionalOutput = (output: string) => {
+ agentsStore.removeAdditionalOutput(output)
+}
+
function handleCurrentTask(task: IRawStepTask, transparent: boolean): ConnectArg[] {
// 创建当前流程与产出的连线
const arr: ConnectArg[] = [
@@ -34,14 +117,14 @@ function handleCurrentTask(task: IRawStepTask, transparent: boolean): ConnectArg
targetId: `task-syllabus-output-object-${task.Id}`,
anchor: [AnchorLocations.Right, AnchorLocations.Left],
config: {
- transparent,
- },
- },
+ transparent
+ }
+ }
]
// 创建当前产出与流程的连线
- task.InputObject_List?.forEach((item) => {
- const id = collaborationProcess.value.find((i) => i.OutputObject === item)?.Id
+ task.InputObject_List?.forEach(item => {
+ const id = collaborationProcess.value.find(i => i.OutputObject === item)?.Id
if (id) {
arr.push({
sourceId: `task-syllabus-output-object-${id}`,
@@ -49,8 +132,8 @@ function handleCurrentTask(task: IRawStepTask, transparent: boolean): ConnectArg
anchor: [AnchorLocations.Left, AnchorLocations.Right],
config: {
type: 'output',
- transparent,
- },
+ transparent
+ }
})
}
})
@@ -61,7 +144,7 @@ function handleCurrentTask(task: IRawStepTask, transparent: boolean): ConnectArg
function changeTask(task?: IRawStepTask, isEmit?: boolean) {
jsplumb.reset()
const arr: ConnectArg[] = []
- agentsStore.agentRawPlan.data?.['Collaboration Process']?.forEach((item) => {
+ agentsStore.agentRawPlan.data?.['Collaboration Process']?.forEach(item => {
arr.push(...handleCurrentTask(item, item.Id !== task?.Id))
})
jsplumb.connects(arr)
@@ -76,26 +159,32 @@ function clear() {
defineExpose({
changeTask,
- clear,
+ clear
})
+
-
+
-
-
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation copy.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation copy.vue
new file mode 100644
index 0000000..8ae0cef
--- /dev/null
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation copy.vue
@@ -0,0 +1,284 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation.vue
new file mode 100644
index 0000000..c60606a
--- /dev/null
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation.vue
@@ -0,0 +1,505 @@
+
+
+
+
+ 智能体分配
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ getAgentLevel(index) }}
+
+
+
+ 请先在智能体库中上传智能体信息
+
+
+
+
+
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/index.vue b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/index.vue
index 1e44563..65db476 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/index.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/index.vue
@@ -3,10 +3,9 @@ import SvgIcon from '@/components/SvgIcon/index.vue'
import { getAgentMapIcon } from '@/layout/components/config.ts'
import { type ConnectArg, Jsplumb } from '@/layout/components/Main/TaskTemplate/utils.ts'
import { type IRawStepTask, useAgentsStore } from '@/stores'
-import { computed } from 'vue'
+import { computed, ref } from 'vue'
import { AnchorLocations } from '@jsplumb/browser-ui'
import MultiLineTooltip from '@/components/MultiLineTooltip/index.vue'
-
import Bg from './Bg.vue'
const emit = defineEmits<{
@@ -26,6 +25,90 @@ const collaborationProcess = computed(() => {
return agentsStore.agentRawPlan.data?.['Collaboration Process'] ?? []
})
+// 编辑状态管理
+const editingTaskId = ref
+ 智能体分配
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ getAgentLevel(index) }}
+
+
+
+ {{ agent.Name }}
+
+
+ 请先在智能体库中上传智能体信息
+
-
任务大纲
+
+ 任务大纲
+
-
+
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/layout/components/Main/TaskTemplate/index.vue b/frontend/src/layout/components/Main/TaskTemplate/index.vue
index c13c8a7..17674a9 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/index.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/index.vue
@@ -5,7 +5,7 @@ import TaskResult from './TaskResult/index.vue'
import { Jsplumb } from './utils.ts'
import { type IRawStepTask, useAgentsStore } from '@/stores'
import { BezierConnector } from '@jsplumb/browser-ui'
-
+import { ref } from 'vue'
const agentsStore = useAgentsStore()
// 智能体库
@@ -15,9 +15,9 @@ const agentRepoJsplumb = new Jsplumb('task-template', {
options: {
curviness: 30, // 曲线弯曲程度
stub: 20, // 添加连接点与端点的距离
- alwaysRespectStubs: true,
- },
- },
+ alwaysRespectStubs: true
+ }
+ }
})
// 任务流程
@@ -32,18 +32,16 @@ const taskResultRef = ref<{
}>()
const taskResultJsplumb = new Jsplumb('task-template')
-
function scrollToElementTop(elementId: string) {
- const element = document.getElementById(elementId);
+ const element = document.getElementById(elementId)
if (element) {
element.scrollIntoView({
behavior: 'smooth',
block: 'start'
- });
+ })
}
}
-
function handleTaskSyllabusCurrentTask(task: IRawStepTask) {
scrollToElementTop(`task-results-${task.Id}-0`)
agentsStore.setCurrentTask(task)
@@ -76,13 +74,14 @@ function clear() {
defineExpose({
changeTask,
resetAgentRepoLine,
- clear,
+ clear
})
+
流程
@@ -103,7 +192,7 @@ defineExpose({
产物
@@ -113,31 +202,50 @@ defineExpose({
- {{ item.StepName }}
-
+ {{ item.StepName }}
- {{ item.TaskContent }}
+
+
+
+
+
+
+
-
-
+
+
+ √
+
+ ×
+
+
+
+
+
+
+ {{ item.TaskContent }}
+
+
@@ -157,9 +265,7 @@ defineExpose({
@@ -169,29 +275,106 @@ defineExpose({
>
{{ agentSelection }}
- {{
- item.TaskProcess.find((i) => i.AgentName === agentSelection)?.Description
- }}
+ {{ item.TaskProcess.find(i => i.AgentName === agentSelection)?.Description }}
{{ item.OutputObject }}
@@ -111,10 +110,10 @@ defineExpose({