wujingjing
2025-01-02 d1a8061067e21463d8544be8bd840984596ed4a9
src/components/vue-flow/ui/nodes/ConditionNode.vue
@@ -1,5 +1,10 @@
<template>
   <NodeBasicLayout v-model:title="data.title" :type="NodeType.Condition" :description="VueFlowHelper.getConfigValue(data, 'description', '根据条件表达式执行不同的分支。')">
   <NodeBasicLayout
      v-model:title="data.title"
      :type="NodeType.Condition"
      :description="VueFlowHelper.getConfigValue(data, 'description', '根据条件表达式执行不同的分支。')"
      :isViewMode="isViewMode"
   >
      <Handle :id="leftId" type="target" :position="Position.Left" />
      <FieldLayout
         v-for="(item, index) in conditionGroupList"
@@ -8,7 +13,7 @@
         :title="item.conditions ? '如果' : '否则'"
      >
         <template #right v-if="item.conditions">
            <el-select v-model="item.operator" class="w-[130px]">
            <el-select v-model="item.operator" class="w-[130px]" :disabled="isViewMode">
               <el-option
                  v-for="item in Object.keys(conditionOperatorMap)"
                  :key="item"
@@ -16,23 +21,33 @@
                  :label="conditionOperatorMap[item]"
               ></el-option>
            </el-select>
            <!-- v-if="conditionGroupList.length > 1" -->
            <span
               v-if="!isViewMode"
               class="ywifont ywicon-shanchu text-red-400 invisible group-hover/conditionGroup:visible cursor-pointer"
               @click="delConditionBranch(index)"
            ></span>
         </template>
         <div class="flex flex-col gap-y-2" v-if="item.conditions">
            <div v-for="(subItem, subIndex) in item.conditions" class="ml-5 flex-items-center gap-x-2 group/conditionItem pr-8">
               <el-input filterable class="w-[120px] flex-0" v-model="subItem.left_value" placeholder="输入变量"> </el-input>
               <el-select filterable v-model="subItem.comparison_operation" class="flex-0 w-[120px]" placeholder="选择条件">
            <div
               v-for="(subItem, subIndex) in item.conditions"
               :key="subIndex"
               class="ml-5 flex-items-center gap-x-2 group/conditionItem pr-8"
            >
               <el-input :readonly="isViewMode" filterable class="w-[120px] flex-0" v-model="subItem.left_value" placeholder="输入变量">
               </el-input>
               <el-select
                  :disabled="isViewMode"
                  filterable
                  v-model="subItem.comparison_operation"
                  class="flex-0 w-[120px]"
                  placeholder="选择条件"
               >
                  <el-option
                     v-for="item in Object.keys(compareOperationMap)"
                     :key="item"
                     :value="item"
                     :label="compareOperationMap[item]"
                     v-for="operation in Object.keys(compareOperationMap)"
                     :key="operation"
                     :value="operation"
                     :label="compareOperationMap[operation]"
                  ></el-option>
               </el-select>
@@ -41,6 +56,7 @@
                     </el-select> -->
               <template v-if="isShowRight(subItem)">
                  <el-input
                     :readonly="isViewMode"
                     v-if="subItem.right_value_type === VarType.Input"
                     v-model="subItem.right_value"
                     class="w-[180px]"
@@ -50,6 +66,7 @@
                  <el-tree-select
                     v-else
                     :disabled="isViewMode"
                     filterable
                     class="w-[120px] flex-0"
                     v-model="subItem.right_value"
@@ -65,13 +82,15 @@
               </template>
               <span
                  v-if="!isViewMode"
                  class="ywifont ywicon-shanchu text-red-400 invisible group-hover/conditionItem:visible cursor-pointer"
                  @click="delConditionItem(item, subIndex)"
               ></span>
            </div>
            <el-button class="w-fit mt-3" type="primary" @click="addConditionItem(item)">添加条件</el-button>
            <el-button v-if="!isViewMode" class="w-fit mt-3" type="primary" @click="addConditionItem(item)">添加条件</el-button>
         </div>
         <el-button v-else @click="addConditionBranch" class="w-fit mt-3" type="success">添加分支</el-button>
         <div v-else-if="isViewMode" class="h-[24px]"></div>
         <el-button v-else-if="!isViewMode" @click="addConditionBranch" class="w-fit mt-3" type="success">添加分支</el-button>
         <Handle class="!right-0 !-translate-y-4" :id="item.id" type="source" :position="Position.Right" />
      </FieldLayout>
   </NodeBasicLayout>
@@ -83,11 +102,15 @@
import { computed, ref, watchEffect } from 'vue';
import { ConditionHelper, VueFlowHelper } from '../../VueFlowHelper';
import { CompareOperation, NodeType, VarType, compareOperationMap, conditionOperatorMap } from '../../vueFlowEnum';
import { LLMNodeData, LLMNodeEvents } from './index';
import type { LLMNodeData, LLMNodeEvents } from './index';
import FieldLayout from './components/FieldLayout.vue';
import NodeBasicLayout from './components/NodeBasicLayout.vue';
defineProps<NodeProps<LLMNodeData, LLMNodeEvents>>();
defineProps<
   NodeProps<LLMNodeData, LLMNodeEvents> & {
      isViewMode?: boolean;
   }
>();
const node = useNode();
const leftId = VueFlowHelper.getHandleId(node, 'target');
const { findNode } = useVueFlow();