From 3e5f676d34a0a4b418907563cba9de7480e7e2e5 Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期三, 11 十二月 2024 18:31:14 +0800 Subject: [PATCH] 输出节点 --- src/components/vue-flow/ui/nodes/OutputNode.vue | 64 ++++++++++++++++++++++++++++++- 1 files changed, 61 insertions(+), 3 deletions(-) diff --git a/src/components/vue-flow/ui/nodes/OutputNode.vue b/src/components/vue-flow/ui/nodes/OutputNode.vue index faf8da3..055a045 100644 --- a/src/components/vue-flow/ui/nodes/OutputNode.vue +++ b/src/components/vue-flow/ui/nodes/OutputNode.vue @@ -57,8 +57,38 @@ interactionTypeMap[item] }}</el-radio> </el-radio-group> + <el-input + v-model="VueFlowHelper.getParams(outputParams, 'output_result').value.value" + type="textarea" + :rows="4" + v-if="VueFlowHelper.getParams(outputParams, 'output_result').value.type === InteractionType.Input" + > + </el-input> - + <div + class="self-start w-full flex-col flex items-start gap-2" + v-else-if="VueFlowHelper.getParams(outputParams, 'output_result').value.type === InteractionType.Select" + > + <div class="flex-column gap-2"> + <div + class="text-gray-400 cursor-not-allowed border border-solid rounded-lg border-gray-300 py-3 pl-3 pr-2 items-center justify-between flex group/option" + :key="item.id" + v-for="(item, index) in VueFlowHelper.getParams(outputParams, 'output_result').options" + > + <span>{{ item.label }}</span> + <span + @click="delOption(index)" + class="cursor-pointer group-hover/option:visible invisible ywifont ywicon-shanchu text-red-500" + ></span> + </div> + </div> + + <div v-if="isEditStatus" class="flex-items-center w-full"> + <el-input class="flex-auto" v-model="tmpEditValue"></el-input> + <el-button class="flex-0 ml-2" type="success" @click="confirmClick">纭畾 </el-button> + </div> + <el-button v-else type="primary" @click="addOptionClick">娣诲姞閫夐」</el-button> + </div> </div> </div> </div> @@ -80,7 +110,8 @@ import { VueFlowHelper } from '../../VueFlowHelper'; import { LLMNodeData, LLMNodeEvents } from './index'; import { deepClone } from '/@/utils/other'; -import { interactionTypeMap } from '../../vueFlowEnum'; +import { InteractionType, interactionTypeMap } from '../../vueFlowEnum'; +import { nextTick } from 'vue'; defineProps<NodeProps<LLMNodeData, LLMNodeEvents>>(); const node = useNode(); @@ -88,7 +119,6 @@ const targetHandleId = ref(VueFlowHelper.getHandleId(node.node, 'target')); const data = ref(node.node.data); - const titleIsEdit = ref(false); @@ -112,4 +142,32 @@ const clickDeleteBtn = () => { removeNodes(node.id); }; +const addOptionClick = () => { + isEditStatus.value = true; +}; + +const confirmClick = () => { + isEditStatus.value = false; + + addOption(tmpEditValue.value); + nextTick(() => { + tmpEditValue.value = ''; + }); +}; +const addOption = (val) => { + const options = VueFlowHelper.getParams(outputParams.value, 'output_result').options; + options.push({ + id: VueFlowHelper.genId(), + label: val, + value: '', + }); +}; + +const delOption = (index) => { + const options = VueFlowHelper.getParams(outputParams.value, 'output_result').options; + options.splice(index); +}; + +const isEditStatus = ref(false); +const tmpEditValue = ref(''); </script> -- Gitblit v1.9.3