-
+
-
+
+
+
+
+
+
@@ -23,4 +47,9 @@
-
+
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
deleted file mode 100644
index 8ae0cef..0000000
--- a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/components/AgentAllocation copy.vue
+++ /dev/null
@@ -1,284 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ 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 65db476..d295094 100644
--- a/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/index.vue
+++ b/frontend/src/layout/components/Main/TaskTemplate/TaskSyllabus/index.vue
@@ -3,7 +3,7 @@ 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, ref } from 'vue'
+import { computed, ref, nextTick } from 'vue'
import { AnchorLocations } from '@jsplumb/browser-ui'
import MultiLineTooltip from '@/components/MultiLineTooltip/index.vue'
import Bg from './Bg.vue'
@@ -11,8 +11,12 @@ import Bg from './Bg.vue'
const emit = defineEmits<{
(el: 'resetAgentRepoLine'): void
(el: 'setCurrentTask', task: IRawStepTask): void
+ (el: 'add-output', outputName: string): void
+ (el: 'click-branch'): void
}>()
+// 分支数量
+
const jsplumb = new Jsplumb('task-syllabus')
const handleScroll = () => {
@@ -30,9 +34,79 @@ const editingTaskId = ref
(null)
const editingContent = ref('')
// 添加新产物状态管理
-const showAddOutputForm = ref(false)
+const isAddingOutput = ref(false)
+const newOutputInputRef = ref()
const newOutputName = ref('')
+// 处理加号点击
+const handleAddOutputClick = () => {
+ isAddingOutput.value = true
+ newOutputName.value = ''
+
+ nextTick(() => {
+ setTimeout(() => {
+ if (newOutputInputRef.value) {
+ newOutputInputRef.value?.focus()
+ }
+ jsplumb.instance.repaintEverything()
+ }, 50)
+ })
+}
+
+// 保存新产物
+const saveNewOutput = () => {
+ if (newOutputName.value.trim()) {
+ const outputName = newOutputName.value.trim()
+ const success = agentsStore.addNewOutput(outputName)
+ if (success) {
+ emit('add-output', outputName)
+ isAddingOutput.value = false
+ newOutputName.value = ''
+ nextTick(() => {
+ setTimeout(() => {
+ jsplumb.instance.repaintEverything()
+ }, 50)
+ })
+ console.log('添加新产物成功', outputName)
+ } else {
+ // 退出编辑状态
+ isAddingOutput.value = false
+ newOutputName.value = ''
+ }
+ }
+}
+
+// 取消添加产物
+const cancelAddOutput = () => {
+ isAddingOutput.value = false
+ newOutputName.value = ''
+
+ nextTick(() => {
+ setTimeout(() => {
+ jsplumb.instance.repaintEverything()
+ }, 50)
+ })
+}
+
+// 处理新产物的键盘事件
+const handleNewOutputKeydown = (event: KeyboardEvent) => {
+ if (event.key === 'Enter') {
+ event.preventDefault()
+ saveNewOutput()
+ } else if (event.key === 'Escape') {
+ cancelAddOutput()
+ }
+}
+
+// 新产物输入框失去焦点处理
+const handleNewOutputBlur = () => {
+ setTimeout(() => {
+ if (newOutputName.value.trim() === '') {
+ cancelAddOutput()
+ }
+ }, 100)
+}
+
// 开始编辑
const startEditing = (task: IRawStepTask) => {
if (!task.Id) {
@@ -71,44 +145,6 @@ const handleKeydown = (event: KeyboardEvent) => {
}
}
-// 显示添加产物表单
-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[] = [
@@ -179,7 +215,7 @@ defineExpose({
class="w-full relative min-h-full"
id="task-syllabus"
>
-
+
@@ -198,7 +234,47 @@ defineExpose({