输出参数名

wujingjing

2024-12-23 dd407c5da58ca201a1fc91af028ace3a6491853b

 src/components/vue-flow/ui/nodes/CodeNode.vue

@@ -2,27 +2,34 @@
   <NodeBasicLayout v-model:title="data.title" :type="NodeType.Code" :showOffset="false" :description="data.description">
      <Handle :id="targetHandleId" type="target" :position="Position.Left" />
      <FieldLayout :title="codeInput.name">
         <div class="flex flex-col gap-y-2 ">
         <div class="flex flex-col gap-y-2">
            <div :key="subIndex" v-for="(subItem, subIndex) in codeInput.params[0].value" class="flex-items-center gap-x-2 pr-8">
               <el-input filterable class="w-[120px] flex-0" v-model="subItem.key" placeholder="参数名"> </el-input>

               <el-input filterable class="w-[120px] flex-0" v-model="subItem.value" placeholder="值"> </el-input>
               <span class="ywifont ywicon-shanchu text-red-400 cursor-pointer " @click="delInputVarItem(subIndex)"></span>
               <span class="ywifont ywicon-shanchu text-red-400 cursor-pointer" @click="delInputVarItem(subIndex)"></span>
            </div>
            <el-button class="w-fit mt-3" type="primary" @click="addInputVarItem">添加新的入参</el-button>
         </div>
      </FieldLayout>
      <FieldLayout :title="codeStr.name">
         <div @scrollend="handleCodeScroll">
         <div class="relative">
            <codemirror
                @click="console.log('nihao')"
               @scroll="handleCodeScroll"
               class="nowheel overflow-auto [&>.cm-editor]:min-h-[140px] [&>.cm-editor]:max-h-[340px]"
               class="nowheel overflow-auto [&>.cm-editor]:min-h-[140px] [&>.cm-editor]:max-h-[340px] cursor-text"
               v-model="codeStr.params[0].value"
               :autofocus="true"
               :indent-with-tab="true"
               :tab-size="2"
               :extensions="javascriptEditorExtensions"
            />
            <!-- <el-tooltip effect="dark" content="全屏" placement="top">
				
            </el-tooltip> -->
            <YWIcon
               class="absolute right-1 top-1 !text-gray-300 cursor-pointer"
               name="pingmufangda"
               @click="fullEditCodeClick(codeStr.params[0])"
            />
         </div>
      </FieldLayout>
@@ -39,13 +46,15 @@
                     :label="parameterTypeMap[item]"
                  ></el-option>
               </el-select>
               <span class="ywifont ywicon-shanchu text-red-400 cursor-pointer " @click="delOutputVarItem(subIndex)"></span>
               <span class="ywifont ywicon-shanchu text-red-400 cursor-pointer" @click="delOutputVarItem(subIndex)"></span>
            </div>
            <el-button class="w-fit mt-3" type="primary" @click="addOutputVarItem">添加新的出参</el-button>
         </div>
      </FieldLayout>
        <Handle :id="sourceHandleId" type="source" :position="Position.Right" />

      <Handle :id="sourceHandleId" type="source" :position="Position.Right" />
      <Teleport to="body">
         <CodeEditDialog v-if="editMapCodeItem" v-model="codeEditDlgIsShow" :item="editMapCodeItem"></CodeEditDialog>
      </Teleport>
   </NodeBasicLayout>
</template>

@@ -58,7 +67,7 @@
import { javascript } from '@codemirror/lang-javascript';
import { vscodeDark } from '@uiw/codemirror-theme-vscode';
import { Codemirror } from 'vue-codemirror';

import CodeEditDialog from './components/CodeEditDlg.vue';
import FieldLayout from './components/FieldLayout.vue';
import NodeBasicLayout from './components/NodeBasicLayout.vue';
import { LLMNodeData, LLMNodeEvents } from './index';
@@ -74,7 +83,6 @@
const codeStr = ref(VueFlowHelper.getGroupParam(data.value, 1));
const codeOutput = ref(VueFlowHelper.getGroupParam(data.value, 2));
const handleCodeScroll = (e) => {
    console.log("🚀 ~ e:", e)
   e.stopPropagation();
};
const getInputEmptyItem = () => {
@@ -127,4 +135,11 @@
   }
   codeOutput.value.params[0].value.push(getOutputEmptyItem());
};

const editMapCodeItem = ref({});
const codeEditDlgIsShow = ref(false);
const fullEditCodeClick = (item) => {
   editMapCodeItem.value = item;
   codeEditDlgIsShow.value = true;
};
</script>