输出节点

wujingjing

2024-12-11 3e5f676d34a0a4b418907563cba9de7480e7e2e5

 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>