From 67fa6342a20755b5ef1cc6ba4f08acf1cc1a643f Mon Sep 17 00:00:00 2001
From: zhanghao <774378400@qq.com>
Date: Mon, 17 Nov 2025 17:32:33 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8D=95=E8=8A=82=E7=82=B9=E6=89=A7?=
 =?UTF-8?q?=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/device/flow.js                      | 116 +--
 src/views/flow/components/NodeTitle.vue     |  28 +-
 src/views/flow/config.js                    |  18 +
 src/views/flow/index.vue                    | 792 ++++++++++++--------
 src/views/flow/nodes/common/serviceNode.vue |   1 +
 src/views/flow/nodes/common/startNode.vue   |   9 +-
 6 files changed, 607 insertions(+), 357 deletions(-)

diff --git a/src/api/device/flow.js b/src/api/device/flow.js
index b3e3b76..e1ad731 100644
--- a/src/api/device/flow.js
+++ b/src/api/device/flow.js
@@ -1,55 +1,63 @@
-import request from '@/utils/request'
-
-// 发布流程
-export function flowDeploy(data) {
-    return request({
-        url: '/flow/publish',
-        method: 'post',
-        data: data
-    })
-}
-
-export function flowExecute(data) {
-    return request({
-        url: '/flow/execute',
-        method: 'post',
-        data: data
-    })
-}
-
-export function flowExecuteTrial(data) {
-    return request({
-        url: '/flow/executeTrial',
-        method: 'post',
-        data: data
-    })
-}
-
-export function flowView(data) {
-    return request({
-        url: '/flow/view',
-        method: 'post',
-        data: data
-    })
-}
-
-export function flowPause(instId) {
-    return request({
-        url: `/flow/pause/${instId}`,
-        method: 'post'
-    })
-}
-
-export function flowResume(instId) {
-    return request({
-        url: `/flow/resume/${instId}`,
-        method: 'post'
-    })
-}
-
-export function flowStop(instId) {
-    return request({
-        url: `/flow/stop/${instId}`,
-        method: 'post'
-    })
+import request from '@/utils/request'
+
+// 发布流程
+export function flowDeploy(data) {
+    return request({
+        url: '/flow/publish',
+        method: 'post',
+        data: data
+    })
+}
+
+export function flowExecute(data) {
+    return request({
+        url: '/flow/execute',
+        method: 'post',
+        data: data
+    })
+}
+
+export function flowAction(data) {
+    return request({
+        url: '/flow/action',
+        method: 'post',
+        data: data
+    })
+}
+
+export function flowExecuteTrial(data) {
+    return request({
+        url: '/flow/executeTrial',
+        method: 'post',
+        data: data
+    })
+}
+
+export function flowView(data) {
+    return request({
+        url: '/flow/view',
+        method: 'post',
+        data: data
+    })
+}
+
+export function flowPause(instId) {
+    return request({
+        url: `/flow/pause/${instId}`,
+        method: 'post'
+    })
+}
+
+export function flowResume(instId) {
+    return request({
+        url: `/flow/resume/${instId}`,
+        method: 'post'
+    })
+}
+
+export function flowStop(instId) {
+    return request({
+        url: `/flow/stop/${instId}`,
+        method: 'post'
+    })
 }
\ No newline at end of file
diff --git a/src/views/flow/components/NodeTitle.vue b/src/views/flow/components/NodeTitle.vue
index 1a66002..b60b2dd 100644
--- a/src/views/flow/components/NodeTitle.vue
+++ b/src/views/flow/components/NodeTitle.vue
@@ -32,13 +32,25 @@
         </div>
       </div>
       <div class="right">
+      <el-tooltip
+          class="box-item"
+          effect="dark"
+          content="执行"
+          placement="top"
+        >
+          <el-button v-if="nodeType && nodeType !=='NONE'" circle @click="execute">
+            <el-icon>
+              <VideoPlay />
+            </el-icon>
+          </el-button>
+        </el-tooltip>
         <el-tooltip
           class="box-item"
           effect="dark"
           :content="zoomState ? '缩小' : '放大'"
           placement="top"
         >
-          <el-button v-if="showZoom" circle size="small" @click="zoom">
+          <el-button v-if="showZoom" circle @click="zoom">
             <el-icon>
               <ZoomOut v-if="zoomState" />
               <ZoomIn v-else />
@@ -51,7 +63,7 @@
           content="删除"
           placement="top"
         >
-          <el-button circle size="small" @click="deleteNode">
+          <el-button circle @click="deleteNode">
             <el-icon><Delete /></el-icon>
           </el-button>
         </el-tooltip>
@@ -62,7 +74,7 @@
 </template>
 <script setup lang="js">
 import { ref } from 'vue'
-import { EditPen, Select, CloseBold, Delete, ZoomOut, ZoomIn } from '@element-plus/icons-vue'
+import { EditPen, Select, CloseBold, Delete, ZoomOut, ZoomIn, VideoPlay } from '@element-plus/icons-vue'
 import { ElMessageBox } from 'element-plus'
 
 const props = defineProps({
@@ -144,6 +156,15 @@ const deleteNode = () => {
 const zoom = () => {
   emits('zoom', !props.zoomState)
 }
+
+const execute = () => {
+  const myEvent = new CustomEvent('singleNodeExecution', {
+    bubbles: false,        // 是否冒泡（默认 false）
+    cancelable: false,     // 是否可被 preventDefault() 取消（默认 false）
+    detail: { ...props.nodeProperties  } // 自定义数据（任意类型，通过 event.detail 读取）
+  });
+  document.dispatchEvent(myEvent);
+}
 </script>
 <style lang="scss" scoped>
 .title__container {
@@ -204,6 +225,7 @@ const zoom = () => {
 
       .el-button {
         border: none;
+        font-size: 24px;
       }
     }
   }
diff --git a/src/views/flow/config.js b/src/views/flow/config.js
index 9584e80..d75dd78 100644
--- a/src/views/flow/config.js
+++ b/src/views/flow/config.js
@@ -125,6 +125,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "在获取相机照片时，需要先启动相机",
         action: 'CAMERA_START',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -136,6 +137,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "获取相机拍摄的照片",
         action: 'CAMERA_GETRGBIMAGE',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -148,6 +150,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "获取相机照片后，关闭该相机",
         action: 'CAMERA_STOP',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -164,6 +167,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "开启摄像头，并开始录像",
         action: 'CAMERA_RECORDING_START',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -175,6 +179,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "停止录像，并关闭摄像头",
         action: 'CAMERA_RECORDING_STOP',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -259,6 +264,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "用于启动麦克风的节点",
         action: 'MICROPHONE_START',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -270,6 +276,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "用于停止麦克风的节点",
         action: 'MICROPHONE_START',
+        nodeType: 'EDGE',
         nodeParams: [
           { name: "deviceId", type: "input", input: "", componentType: 'select', selectOptions: deviceOptions(), disabled: true }
         ],
@@ -297,6 +304,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "用于获取触控坐标的节点",
         action: 'TOUCH_COORDINATES',
+        nodeType: "LLM",
         nodeParams: [
           { name: "targetFeature", type: "input", input: "运动模式",  disabled: true },
           { name: "manufacturer", type: "input", input: "xiaomi",  disabled: true },
@@ -310,6 +318,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "将指令文本(text)处理合成语音，输出语音路径(audioPath)",
         action: 'GENERATE_ADVANCED_AUDIO',
+        nodeType: "LLM",
         outputType: 'json',
         nodeParams: [{ name: 'text', type: "input", input: "",  disabled: true }],
         outputParams: [{ name: 'audioPath', type: 'string', desc: '语音路径', disabled: true}]
@@ -319,6 +328,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "意图识别，输出类型(type) 1: 语音交互  2: 触控交互 3: 闲聊 4: 知识问答",
         action: 'INTENT_RECOGNITION',
+        nodeType: "LLM",
         outputType: 'json',
         nodeParams: [{ name: 'text', type: "input", input: "",  disabled: true }],
         outputParams: [{ name: 'type', type: 'string', desc: '1：语音交互  2：触控交互 3: 闲聊 4:知识问答', disabled: true}]
@@ -347,6 +357,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "唤醒语料处理,输入唤醒语料(wakeCorpus)，输出语音路径(audioPath)",
         action: 'VI_CORPUS_WAKE',
+        nodeType: "EDGE",
         outputType: 'json',
         nodeParams: [{ name: 'wakeCorpus', type: "input", input: "",  disabled: true }],
         outputParams: [{ name: 'audioPath', type: 'string', desc: '语音路径', disabled: true}]
@@ -357,6 +368,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "测试语料-单次对话语料处理,输入单次对话语料(testCorpus)，输出语音路径(audioPath)",
         action: 'VI_CORPUS_SINGLE',
+        nodeType: "EDGE",
         outputType: 'json',
         nodeParams: [{ name: 'testCorpus', type: "input", input: "",  disabled: true }],
         outputParams: [{ name: 'audioPath', type: 'string', desc: '语音路径', disabled: true}]
@@ -367,6 +379,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "测试语料-连续对话语料处理,输入连续对话语料(testCorpus)，输出语音路径(audioPath)",
         action: 'VI_CORPUS_CONTINUOUS',
+        nodeType: "EDGE",
         outputType: 'json',
         nodeParams: [{ name: 'testCorpus', type: "input", input: "",  disabled: true }],
         outputParams: [{ name: 'audioPath', type: 'string', desc: '语音路径', disabled: true}]
@@ -377,6 +390,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "用于播放语料的节点，需要输入语音路径(audioPath)和播放语音的设备id(deviceId)",
         action: 'VI_PLAY_CORPUS',
+        nodeType: "EDGE",
         outputType: 'json',
         nodeParams: [
           { name: 'audioPath', type: "input", input: "",  disabled: true },
@@ -394,6 +408,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "去触控坐标的点位",
         action: 'TOUCH',
+        nodeType: "EDGE",
         nodeParams: [
           { name: "deviceId", type: "input", input: "", disabled: true },
           { name: "touchParams", type: "input", input: "", disabled: true }
@@ -406,6 +421,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "控制机器人说话",
         action: 'BIO_HEAD_SPEAK_START',
+        nodeType: "EDGE",
         nodeParams: [
           { name: "deviceId", type: "input", input: "", disabled: true }
         ],
@@ -417,6 +433,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "停止机器人说话",
         action: 'BIO_HEAD_SPEAK_STOP',
+        nodeType: "EDGE",
         nodeParams: [
           { name: "deviceId", type: "input", input: "", disabled: true }
         ],
@@ -428,6 +445,7 @@ export const collapseList = [
         type: "serviceNode",
         desc: "控制机器人的面部表情",
         action: 'BIO_HEAD_SPECIAL_EXPRESSION',
+        nodeType: "EDGE",
         nodeParams: [
           { name: "deviceId", type: "input", input: "", disabled: true },
           { name: "expressKey", type: "input",componentType: 'select', selectOptions: expressOptions(), disabled: true },
diff --git a/src/views/flow/index.vue b/src/views/flow/index.vue
index 7c44aa6..612c036 100644
--- a/src/views/flow/index.vue
+++ b/src/views/flow/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="page">
     <el-container class="page__container">
-      <el-header v-if="!flowInfoData.isLog" >
+      <el-header v-if="!flowInfoData.isLog">
         <div>
           <div>{{ flowInfoData.name }}</div>
           <div>{{ stateMap[flowState] }}</div>
@@ -9,10 +9,20 @@
         <div class="btn__container">
           <div class="btn">
             <el-button @click="group">分组</el-button>
-            <el-button v-if="flowState !== 'testRunning'" @click="testRun">试运行</el-button>
-            <el-button v-if="flowState === 'testRunning'" @click="flowPauseFn">暂停</el-button>
-            <el-button v-if="flowState === 'pause'" @click="flowResumeFn">恢复</el-button>
-            <el-button v-if="['testRunning', 'pause'].includes(flowState)" @click="flowStopFn">终止</el-button>
+            <el-button v-if="flowState !== 'testRunning'" @click="testRun"
+              >试运行</el-button
+            >
+            <el-button v-if="flowState === 'testRunning'" @click="flowPauseFn"
+              >暂停</el-button
+            >
+            <el-button v-if="flowState === 'pause'" @click="flowResumeFn"
+              >恢复</el-button
+            >
+            <el-button
+              v-if="['testRunning', 'pause'].includes(flowState)"
+              @click="flowStopFn"
+              >终止</el-button
+            >
           </div>
           <div class="btn">
             <el-tooltip
@@ -22,25 +32,35 @@
               placement="top"
               v-if="flowState !== 'testRunFinish'"
             >
-              <el-button  type="primary" :disabled="true">发布</el-button>
+              <el-button type="primary" :disabled="true">发布</el-button>
             </el-tooltip>
-            <el-button v-else @click="deployFlow" type="primary">发布</el-button>
+            <el-button v-else @click="deployFlow" type="primary"
+              >发布</el-button
+            >
 
-            <el-popover :width="260" @show="showNodeRelationship" popper-class="node-relationship-network-popover">
+            <el-popover
+              :width="260"
+              @show="showNodeRelationship"
+              popper-class="node-relationship-network-popover"
+            >
               <template #reference>
-                <el-button style="margin-right: 16px"><el-icon><Location /></el-icon></el-button>
+                <el-button style="margin-right: 16px"
+                  ><el-icon><Location /></el-icon
+                ></el-button>
               </template>
               <div>
                 <div class="title">节点关系网</div>
                 <div class="fit">
-                <el-tooltip
-                  class="box-item"
-                  effect="dark"
-                  content="适应屏幕"
-                  placement="bottom"
-                >
-                  <el-button size="small" circle @click="fitView"><el-icon><Location /></el-icon></el-button>
-                </el-tooltip>
+                  <el-tooltip
+                    class="box-item"
+                    effect="dark"
+                    content="适应屏幕"
+                    placement="bottom"
+                  >
+                    <el-button size="small" circle @click="fitView"
+                      ><el-icon><Location /></el-icon
+                    ></el-button>
+                  </el-tooltip>
                 </div>
                 <el-tree
                   style="max-width: 600px"
@@ -59,104 +79,201 @@
           <Aside />
         </el-aside>
         <el-main>
-          <div class="flow__container" ref="flowContainerRef" @dragover="dragover" @drop="drop"></div>
+          <div
+            class="flow__container"
+            ref="flowContainerRef"
+            @dragover="dragover"
+            @drop="drop"
+          ></div>
         </el-main>
       </el-container>
     </el-container>
 
-    <TestRun :drawer="isOpen" @close="isOpen = false" @changeState="changeState" :flowId="flowInfoData.itemId" />
+    <TestRun
+      :drawer="isOpen"
+      @close="isOpen = false"
+      @changeState="changeState"
+      :flowId="flowInfoData.itemId"
+    />
   </div>
+
+  <el-dialog v-model="visible" width="500" append-to-body>
+    <template #header="{ close, titleId, titleClass }">
+      <div class="my-header">
+        <h4 :id="titleId" :class="titleClass">执行{{ nodeName }}节点</h4>
+      </div>
+    </template>
+    <el-form
+      :inline="true"
+      :model="formData"
+      :rules="rules"
+      ref="executeForm"
+      label-position="top"
+      label-width="auto"
+      :disabled="flowStore.disableForm"
+    >
+      <div v-for="(property, index) in formData.nodeParams" :key="index">
+        <el-row>
+          <el-form-item
+            :label="index === 0 ? '参数名' : ''"
+            :prop="`nodeParams.${index}.name`"
+            :rules="[
+              { required: true, message: '请输入参数名', trigger: 'blur' },
+            ]"
+          >
+            <el-input
+              :disabled="property?.disabled || false"
+              v-model="property.name"
+              placeholder="请输入"
+              clearable
+            />
+          </el-form-item>
+          <el-form-item
+            :label="index === 0 ? '参数值' : ''"
+            :prop="`nodeParams.${index}.input`"
+            :rules="[
+              { required: true, message: '请输入参数值', trigger: 'blur' },
+            ]"
+          >
+            <el-input-number
+              v-if="property.componentType === 'number'"
+              v-model="property.input"
+              :min="0"
+              :controls="false"
+              :step-strictly="true"
+              placeholder="请输入"
+              clearable
+            />
+            <el-select
+              v-model="property.input"
+              v-else-if="property.componentType === 'select'"
+            >
+              <el-option
+                v-for="item in property.selectOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+            <el-input
+              v-else
+              v-model="property.input"
+              autosize
+              type="textarea"
+              placeholder="请输入"
+              clearable
+            />
+          </el-form-item>
+        </el-row>
+      </div>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="visible = false">取消</el-button>
+        <el-button type="primary" @click="execute">
+          确定
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>
 <script setup>
 import { ref, onMounted, onUnmounted, nextTick } from "vue";
 import LogicFlow, { action } from "@logicflow/core";
 import "@logicflow/core/es/index.css";
 import "@logicflow/core/lib/style/index.css";
-import '@logicflow/extension/lib/style/index.css'
-import { lfConfig, registerCustomizeNode } from './config'
+import "@logicflow/extension/lib/style/index.css";
+import { lfConfig, registerCustomizeNode } from "./config";
 import TestRun from "./components/TestRun.vue";
 import Aside from "./components/Aside.vue";
-import { ElMessage } from 'element-plus'
-import { useFlowStore } from '@/store/modules/flow'
-import { emitter } from '@/utils/eventBus';
-import { recursiveFilter, newEdge, convertToTree } from '@/utils/flow'
-import { flowDeploy, flowView, flowPause, flowResume, flowStop } from '@/api/device/flow'
-import { getDetect } from '@/api/test/detect'
+import { ElMessage } from "element-plus";
+import { useFlowStore } from "@/store/modules/flow";
+import { emitter } from "@/utils/eventBus";
+import { recursiveFilter, newEdge, convertToTree } from "@/utils/flow";
+import {
+  flowDeploy,
+  flowView,
+  flowPause,
+  flowResume,
+  flowStop,
+  flowAction
+} from "@/api/device/flow";
+import { getDetect } from "@/api/test/detect";
 import { Location } from "@element-plus/icons-vue";
 
 const flowContainerRef = ref(null);
 const lfRef = ref(null);
 
 const dragover = (e) => {
-  e.preventDefault()
-}
+  e.preventDefault();
+};
 
 const drop = (e) => {
-  let node = e.dataTransfer.getData('flowNode');
-  node = JSON.parse(node)
-  if (['stopLoop', 'subEnd', 'subStart'].includes(node.type)) {
-    ElMessage.warning('此节点只能拖拽到循环节点的循环体中')
-    return
+  let node = e.dataTransfer.getData("flowNode");
+  node = JSON.parse(node);
+  if (["stopLoop", "subEnd", "subStart"].includes(node.type)) {
+    ElMessage.warning("此节点只能拖拽到循环节点的循环体中");
+    return;
   }
-  const point = lf.getPointByClient(e.clientX, e.clientY)
-  const { type, ...other } = node
+  const point = lf.getPointByClient(e.clientX, e.clientY);
+  const { type, ...other } = node;
   lf.addNode({
-      type,
-      x: point.canvasOverlayPosition.x,
-      y: point.canvasOverlayPosition.y,
-      properties: {
-        ...other
-      }
-  })
-}
+    type,
+    x: point.canvasOverlayPosition.x,
+    y: point.canvasOverlayPosition.y,
+    properties: {
+      ...other,
+    },
+  });
+};
 
-const flowStore = useFlowStore()
-flowStore.getDeviceList()
+const flowStore = useFlowStore();
+flowStore.getDeviceList();
 
-const isOpen = ref(false)
+const isOpen = ref(false);
 const stateMap = {
-  unpublished: '未发布',
-  testRunning: '试运行中',
-  testRunFinish: '试运行成功',
-  testRunError: '试运行失败',
-  release: '已发布',
-  updateData: '修改中',
-  pause: '已暂停',
-  stop: '已终止'
-}
-const flowState = ref('unpublished')
+  unpublished: "未发布",
+  testRunning: "试运行中",
+  testRunFinish: "试运行成功",
+  testRunError: "试运行失败",
+  release: "已发布",
+  updateData: "修改中",
+  pause: "已暂停",
+  stop: "已终止",
+};
+const flowState = ref("unpublished");
 const flowInfoData = ref({
-  itemId: '',
-  instId: '',
-  taskId: '',
+  itemId: "",
+  instId: "",
+  taskId: "",
   isLog: false,
-  name: '流程'
-})
+  name: "流程",
+});
 
 /**
  * 试运行
  */
 const testRun = async () => {
   // 1、验证画布内所有的表单通过验证
-  const { nodes, edges } = lf.getGraphData()
+  const { nodes, edges } = lf.getGraphData();
 
-  const isolatedNodes = nodes.filter(node => {
+  const isolatedNodes = nodes.filter((node) => {
     const nodeId = node.id;
     // 检查是否存在关联边
-    return !edges.some(edge => 
-      edge.sourceNodeId === nodeId || edge.targetNodeId === nodeId
+    return !edges.some(
+      (edge) => edge.sourceNodeId === nodeId || edge.targetNodeId === nodeId
     );
   });
-  
-  const gl = isolatedNodes.filter(item => {
-    return !item.properties?.parentId && item.type !== 'selectArea'
-  })
+
+  const gl = isolatedNodes.filter((item) => {
+    return !item.properties?.parentId && item.type !== "selectArea";
+  });
 
   if (gl && gl.length > 0) {
-    ElMessage.warning('存在孤立的节点，请检查！')
-    return
+    ElMessage.warning("存在孤立的节点，请检查！");
+    return;
   }
-  
+
   let allValid = true;
   for (const node of nodes) {
     const nodeModel = lf.getNodeModelById(node.id);
@@ -167,40 +284,40 @@ const testRun = async () => {
       }
     }
   }
-    
+
   if (allValid) {
-    isOpen.value = true
+    isOpen.value = true;
   } else {
-    ElMessage.error('部分节点验证失败，请查看详情');
+    ElMessage.error("部分节点验证失败，请查看详情");
   }
-}
+};
 
 // 流程暂停
 const flowPauseFn = async () => {
-  const res = await flowPause(instId.value)
+  const res = await flowPause(instId.value);
   if (res.code === 200) {
-    flowState.value = 'pause'
+    flowState.value = "pause";
     ElMessage.success(res.msg);
   }
-}
+};
 
 const flowResumeFn = async () => {
-  const res = await flowResume(instId.value)
+  const res = await flowResume(instId.value);
   if (res.code === 200) {
-    flowState.value = 'testRunning'
-    loopFlowView(instId.value)
+    flowState.value = "testRunning";
+    loopFlowView(instId.value);
     ElMessage.success(res.msg);
   }
-}
+};
 
 const flowStopFn = async () => {
-  const res = await flowStop(instId.value)
+  const res = await flowStop(instId.value);
   if (res.code === 200) {
-    flowState.value = 'stop'
-    flowStore.updateDisableForm(false)
+    flowState.value = "stop";
+    flowStore.updateDisableForm(false);
     ElMessage.success(res.msg);
   }
-}
+};
 
 const initFlowData = {
   nodes: [
@@ -209,199 +326,211 @@ const initFlowData = {
       x: 300,
       y: 100,
       properties: {
-        name: 'Start',
-        action: 'start'
-      }
+        name: "Start",
+        action: "start",
+      },
     },
     {
       type: "end",
       x: 1300,
       y: 700,
       properties: {
-        name: 'End',
-        action: 'end'
-      }
-    }
+        name: "End",
+        action: "end",
+      },
+    },
   ],
   // 边
   edges: [],
 };
 
 const validEdge = (data) => {
-  const sourceAnchorArr = lf.getNodeModelById(data.sourceNodeId).anchors
-  const [sourceName] = sourceAnchorArr.filter(item => {
-    return item.id === data.sourceAnchorId
-  }).map(item=> {
-    return item.name
-  })
+  const sourceAnchorArr = lf.getNodeModelById(data.sourceNodeId).anchors;
+  const [sourceName] = sourceAnchorArr
+    .filter((item) => {
+      return item.id === data.sourceAnchorId;
+    })
+    .map((item) => {
+      return item.name;
+    });
 
-  const targetAnchorArr = lf.getNodeModelById(data.targetNodeId).anchors
-  const [targetName] = targetAnchorArr.filter(item => {
-    return item.id === data.targetAnchorId
-  }).map(item=> {
-    return item.name
-  })
+  const targetAnchorArr = lf.getNodeModelById(data.targetNodeId).anchors;
+  const [targetName] = targetAnchorArr
+    .filter((item) => {
+      return item.id === data.targetAnchorId;
+    })
+    .map((item) => {
+      return item.name;
+    });
 
-  if (sourceName === 'right' && targetName === 'left') {
-    return
-  } else if ((sourceName === 'right' && targetName === 'right') || (sourceName === 'left' && targetName === 'left')) {
+  if (sourceName === "right" && targetName === "left") {
+    return;
+  } else if (
+    (sourceName === "right" && targetName === "right") ||
+    (sourceName === "left" && targetName === "left")
+  ) {
     lf.deleteEdge(data.id);
-  } else if (sourceName === 'left' && targetName === 'right') {
-    const sourceNodeId = data.targetNodeId
-    const sourceAnchorId = data.targetAnchorId
-    const targetNodeId = data.sourceNodeId
-    const targetAnchorId = data.sourceAnchorId
+  } else if (sourceName === "left" && targetName === "right") {
+    const sourceNodeId = data.targetNodeId;
+    const sourceAnchorId = data.targetAnchorId;
+    const targetNodeId = data.sourceNodeId;
+    const targetAnchorId = data.sourceAnchorId;
     lf.deleteEdge(data.id);
     lf.addEdge({
-      type: 'bezier',
+      type: "bezier",
       sourceNodeId,
       targetNodeId,
       sourceAnchorId,
-      targetAnchorId
+      targetAnchorId,
     });
   }
-}
+};
 
-const instId = ref(null)
+const instId = ref(null);
 const changeState = (value) => {
-  const flowData = JSON.parse(JSON.stringify(lf.getGraphData()))
-  oldFlowData = flowData
-  isOpen.value = false
-  flowStore.updateDisableForm(true)
-  flowState.value = value.type
+  const flowData = JSON.parse(JSON.stringify(lf.getGraphData()));
+  oldFlowData = flowData;
+  isOpen.value = false;
+  flowStore.updateDisableForm(true);
+  flowState.value = value.type;
 
-  instId.value = value.instId
-  loopFlowView(value.instId)
-}
+  instId.value = value.instId;
+  loopFlowView(value.instId);
+};
 
 const loopFlowView = async (instId, taskId = null) => {
   const params = {
     itemId: flowInfoData.value.itemId,
     instId,
-  }
+  };
   if (taskId) {
-    params.taskId = taskId
+    params.taskId = taskId;
   }
-  const res = await flowView(params)
+  const res = await flowView(params);
   if (res.code === 200) {
-    const arr = res.data || []
-    arr.forEach(item => {
-      emitter.emit('changeNodeState', item)
-    })
-    oldFlowData = JSON.parse(JSON.stringify(lf.getGraphData()))
-    if (arr[arr.length - 1]?.nodeType !== 'END' && !['FAILED', 'STOPPED'].includes(arr[arr.length - 1]?.status)) {
+    const arr = res.data || [];
+    arr.forEach((item) => {
+      emitter.emit("changeNodeState", item);
+    });
+    oldFlowData = JSON.parse(JSON.stringify(lf.getGraphData()));
+    if (
+      arr[arr.length - 1]?.nodeType !== "END" &&
+      !["FAILED", "STOPPED"].includes(arr[arr.length - 1]?.status)
+    ) {
       setTimeout(() => {
-        loopFlowView(instId)
-      }, 2000)
-      } else if (arr[arr.length - 1]?.nodeType === 'END' && arr[arr.length - 1]?.status === 'SUCCESS') {
-        if (!flowInfoData.value.isLog) {
-          flowStore.updateDisableForm(false)
-          flowState.value = 'testRunFinish'
-        }
+        loopFlowView(instId);
+      }, 2000);
+    } else if (
+      arr[arr.length - 1]?.nodeType === "END" &&
+      arr[arr.length - 1]?.status === "SUCCESS"
+    ) {
+      if (!flowInfoData.value.isLog) {
+        flowStore.updateDisableForm(false);
+        flowState.value = "testRunFinish";
+      }
     } else {
       if (!flowInfoData.value.isLog) {
-        if (['PAUSED', 'STOPPED'].includes(arr[arr.length - 1]?.status)) {
-          flowState.value = arr[arr.length - 1]?.status === 'PAUSED' ? 'pause' : 'stop'
+        if (["PAUSED", "STOPPED"].includes(arr[arr.length - 1]?.status)) {
+          flowState.value =
+            arr[arr.length - 1]?.status === "PAUSED" ? "pause" : "stop";
         } else {
-          flowState.value = 'testRunError'
-          flowStore.updateDisableForm(false)
-        } 
+          flowState.value = "testRunError";
+          flowStore.updateDisableForm(false);
+        }
       }
     }
-  } 
-}
+  }
+};
 
-let oldFlowData = {}
+let oldFlowData = {};
 /**
  * 发布
  */
 const deployFlow = async () => {
-  if (flowState.value !== 'testRunFinish') {
-    ElMessage.warning('试运行成功后才可以发布')
-    return
+  if (flowState.value !== "testRunFinish") {
+    ElMessage.warning("试运行成功后才可以发布");
+    return;
   }
-  
+
   try {
-    const res = await flowDeploy({ id: flowInfoData.value.itemId })
+    const res = await flowDeploy({ id: flowInfoData.value.itemId });
 
     if (res.code === 200) {
-      ElMessage.success(res.msg)
-      flowState.value = 'release'
+      ElMessage.success(res.msg);
+      flowState.value = "release";
     } else {
-      ElMessage.error(res.msg)
+      ElMessage.error(res.msg);
     }
   } catch (error) {
-    ElMessage.error('部署操作产生异常')
+    ElMessage.error("部署操作产生异常");
   }
-}
-
+};
 
 const loadFlowData = async (id, lf) => {
   try {
-    const res = await getDetect(id)
+    const res = await getDetect(id);
     if (res.data && res.data.flowData) {
-      const flowData = JSON.parse(res.data.flowData)
-      const selectArea = []
-      flowData.nodes.forEach(item => {
-        if(item.type === 'selectArea') {
-          selectArea.push(...item.children)
+      const flowData = JSON.parse(res.data.flowData);
+      const selectArea = [];
+      flowData.nodes.forEach((item) => {
+        if (item.type === "selectArea") {
+          selectArea.push(...item.children);
         }
-      })
+      });
 
       lf.render(flowData);
-      
-      nextTick(() =>  {
-        selectArea.forEach(item => {
-          lf.getNodeModelById(item).draggable = false
-        })
-        oldFlowData = JSON.parse(JSON.stringify(lf.getGraphData()))
-        lf.fitView()
-      })
+
+      nextTick(() => {
+        selectArea.forEach((item) => {
+          lf.getNodeModelById(item).draggable = false;
+        });
+        oldFlowData = JSON.parse(JSON.stringify(lf.getGraphData()));
+        lf.fitView();
+      });
     } else {
       // 渲染数据 data
       lf.render(initFlowData);
-      oldFlowData = initFlowData
-      nextTick(() => lf.zoom(0.8, [850, 450]) )
+      oldFlowData = initFlowData;
+      nextTick(() => lf.zoom(0.8, [850, 450]));
     }
-  }
-  catch(err) {
+  } catch (err) {
     lf.render(initFlowData);
-    oldFlowData = initFlowData
-    nextTick(() => lf.zoom(0.8, [850, 450]) )
+    oldFlowData = initFlowData;
+    nextTick(() => lf.zoom(0.8, [850, 450]));
   }
-}
+};
 
 const registerBeforeUnload = () => {
-  window.addEventListener('beforeunload', handleBeforeUnload)
-}
+  window.addEventListener("beforeunload", handleBeforeUnload);
+};
 
 const handleBeforeUnload = (event) => {
-  if (flowState.value === 'pause' && !flowInfoData.value.isLog) {
-    flowStopFn()
+  if (flowState.value === "pause" && !flowInfoData.value.isLog) {
+    flowStopFn();
   }
-}
+};
 
 const justLoadFlow = () => {
   const url = new URL(window.location.href);
-  const locationParams = Object.fromEntries(url.searchParams.entries())
+  const locationParams = Object.fromEntries(url.searchParams.entries());
   if (locationParams?.itemId) {
-    flowState.value = locationParams.state === '0' ? 'release' : 'unpublished'
+    flowState.value = locationParams.state === "0" ? "release" : "unpublished";
     flowInfoData.value = {
       itemId: locationParams.itemId,
-      instId: locationParams?.instId || '',
-      taskId: locationParams?.taskId || '',
+      instId: locationParams?.instId || "",
+      taskId: locationParams?.taskId || "",
       isLog: locationParams?.isLog || false,
-      name: decodeURIComponent(locationParams.name)
-    }
+      name: decodeURIComponent(locationParams.name),
+    };
 
     if (flowInfoData.value.isLog) {
-      flowStore.updateDisableForm(true)
+      flowStore.updateDisableForm(true);
       setTimeout(() => {
-        loopFlowView(flowInfoData.value.instId, flowInfoData.value.taskId)
-      }, 1000)
+        loopFlowView(flowInfoData.value.instId, flowInfoData.value.taskId);
+      }, 1000);
     }
   }
-}
+};
 
 const initFlow = () => {
   if (flowContainerRef.value) {
@@ -409,9 +538,9 @@ const initFlow = () => {
       container: flowContainerRef.value,
       ...lfConfig,
       zoomOptions: {
-        initScale: 0.5,  // 初始缩放 50%
-        minScale: 0.1,   // 最小缩放 10%
-        maxScale: 3      // 最大缩放 300%
+        initScale: 0.5, // 初始缩放 50%
+        minScale: 0.1, // 最小缩放 10%
+        maxScale: 3, // 最大缩放 300%
       },
       keyboard: {
         enabled: true,
@@ -420,182 +549,232 @@ const initFlow = () => {
             keys: ["backspace", "delete"], // 覆盖删除键
             callback: () => {
               const activeElem = document.activeElement;
-              if (activeElem.tagName === 'INPUT' || 
-                  activeElem.tagName === 'TEXTAREA') {
-                  return; // 不处理输入框内的删除
+              if (
+                activeElem.tagName === "INPUT" ||
+                activeElem.tagName === "TEXTAREA"
+              ) {
+                return; // 不处理输入框内的删除
               }
 
               const { nodes, edges } = lf.getSelectElements();
               if (nodes.length > 0) {
                 // 检查是否存在受保护节点
-                const hasProtectedNode = nodes.some(node => 
-                  ['start', 'end'].includes(node.type)
-                )
+                const hasProtectedNode = nodes.some((node) =>
+                  ["start", "end"].includes(node.type)
+                );
 
                 if (hasProtectedNode) {
                   lf.selectElementById(null); // 取消选中
                   return; // 阻断删除
                 }
-                
+
                 // 默认删除逻辑
-                nodes.forEach(node => {
-                  if (node.type === 'selectArea') {
-                    lf.getNodeModelById(node.id).children = []
-                    node.children.forEach(item => {
-                      lf.getNodeModelById(item).draggable = true
-                    })
+                nodes.forEach((node) => {
+                  if (node.type === "selectArea") {
+                    lf.getNodeModelById(node.id).children = [];
+                    node.children.forEach((item) => {
+                      lf.getNodeModelById(item).draggable = true;
+                    });
                   }
 
-                  lf.deleteNode(node.id)
+                  lf.deleteNode(node.id);
                   // 删除节点所有的边
                   lf.deleteEdgeByNodeId(node.id);
                 });
-                return
+                return;
               }
-              if (nodes.length ===0 && edges.length > 0) {
-                edges.forEach(node => {
+              if (nodes.length === 0 && edges.length > 0) {
+                edges.forEach((node) => {
                   // 删除边
                   lf.deleteEdge(node.id);
-                })
+                });
               }
-            }
+            },
           },
           {
-            keys: ["ctrl+z"],  // 自定义快捷键
+            keys: ["ctrl+z"], // 自定义快捷键
             callback: () => {
-              return false
-            }
+              return false;
+            },
           },
           {
             keys: ["ctrl+shift+z"],
-            callback: () => false
-          }
-        ]
+            callback: () => false,
+          },
+        ],
       },
-    })
+    });
 
-    registerCustomizeNode(lf)
+    registerCustomizeNode(lf);
 
-    loadFlowData(flowInfoData.value.itemId, lf)
+    loadFlowData(flowInfoData.value.itemId, lf);
 
-    lf.on('edge:add', ({ data }) => {
-      validEdge(data)
+    lf.on("edge:add", ({ data }) => {
+      validEdge(data);
     });
 
     // 监听历史记录变化
     lf.on("history:change", ({ data }) => {
       if (flowStore.disableForm) {
-        return
+        return;
       }
-      const flowData =  lf.getGraphData()
+      const flowData = lf.getGraphData();
       if (JSON.stringify(oldFlowData) === JSON.stringify(flowData)) {
-        return
+        return;
       }
-      flowState.value = 'updateData'
+      flowState.value = "updateData";
     });
 
     // 监听子节点拖动事件
     lf.on("node:mousemove", ({ data, e }) => {
       const { nodes } = lf.getGraphData();
-      const arr = recursiveFilter(nodes, data.id, 'loop')
-      arr.forEach(item => {
-        const node = lf.getNodeModelById(item.id)
-        node.updateSize()
-      })
-      operationEdge(arr)
+      const arr = recursiveFilter(nodes, data.id, "loop");
+      arr.forEach((item) => {
+        const node = lf.getNodeModelById(item.id);
+        node.updateSize();
+      });
+      operationEdge(arr);
     });
 
     lf.on("node:mouseleave", ({ data }) => {
-      const node = lf.getNodeModelById(data.id)
-      node.setCustomProperties && node.setCustomProperties()
-    })
+      const node = lf.getNodeModelById(data.id);
+      node.setCustomProperties && node.setCustomProperties();
+    });
 
     lfRef.value = lf;
-    window.lf = lf
+    window.lf = lf;
   }
-}
+};
 
 const group = () => {
-  const PADDING = 200
+  const PADDING = 200;
   lf.extension.selectionSelect.openSelectionSelect();
-  lf.once('selection:selected', (data) => {
-   
-    let minX = Infinity
-    let minY = Infinity
-    let maxX = -Infinity
-    let maxY = -Infinity
+  lf.once("selection:selected", (data) => {
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
 
-    let children = [] 
-    data.elements.forEach(item => {
-      if (item.BaseType === 'node') {
-        minX = Math.min(minX, item.x - item.width / 2)
-        minY = Math.min(minY, item.y - item.height / 2)
-        maxX = Math.max(maxX, item.x + item.width / 2)
-        maxY = Math.max(maxY, item.y + item.height / 2)
-        children.push(item.id)
-        lf.getNodeModelById(item.id).draggable = false
+    let children = [];
+    data.elements.forEach((item) => {
+      if (item.BaseType === "node") {
+        minX = Math.min(minX, item.x - item.width / 2);
+        minY = Math.min(minY, item.y - item.height / 2);
+        maxX = Math.max(maxX, item.x + item.width / 2);
+        maxY = Math.max(maxY, item.y + item.height / 2);
+        children.push(item.id);
+        lf.getNodeModelById(item.id).draggable = false;
       }
-    })
+    });
     if (children.length === 0) {
-      return
+      return;
     }
-    let width = maxX - minX + PADDING
-    let height = maxY - minY + PADDING
-    
+    let width = maxX - minX + PADDING;
+    let height = maxY - minY + PADDING;
+
     lf.addNode({
-      type: 'selectArea',
+      type: "selectArea",
       x: minX + (maxX - minX) / 2,
       y: minY + (maxY - minY) / 2,
       properties: {
         width,
         height,
       },
-      children
-    })
-    lf.clearSelectElements()
+      children,
+    });
+    lf.clearSelectElements();
     lf.extension.selectionSelect.closeSelectionSelect();
   });
-}
+};
 
-const treeData = ref(null)
+const treeData = ref(null);
 const defaultProps = {
-  children: 'children',
-  label: 'name',
-}
+  children: "children",
+  label: "name",
+};
 const showNodeRelationship = () => {
-  const { nodes } = lf.getGraphData()
+  const { nodes } = lf.getGraphData();
   const outputData = convertToTree(nodes);
-  treeData.value = outputData
-}
+  treeData.value = outputData;
+};
 
 const handleTreeNodeClick = (node) => {
   lf.focusOn({
-    id: node.id
-  })
-  lf.selectElementById(node.id)
-}
+    id: node.id,
+  });
+  lf.selectElementById(node.id);
+};
 
 const fitView = () => {
-  lf.fitView()
+  lf.fitView();
+};
+
+const nodeName = ref("");
+const visible = ref(false)
+const formData = reactive({
+  nodeParams: [],
+})
+const rules = reactive({})
+const executeForm = ref()
+const nodeAction = ref('')
+
+const singleNodeExecution = (e) => {
+  const { name, nodeType, nodeParams, action } = e.detail;
+  nodeName.value = name;
+  visible.value = true;
+  nodeAction.value = action
+  if (nodeType === 'EDGE') {
+    formData.nodeParams = [
+      {
+        disabled: true,
+        input: "",
+        name: "terminalId",
+        type: "input"
+      },
+      ...nodeParams
+    ]
+  } else {
+    formData.nodeParams = nodeParams
+  }
+};
+
+const execute = async () => {
+  const result = await executeForm.value.validate();
+  if (result) {
+    const obj = {}
+    formData.nodeParams.forEach(item => {
+      obj[item.name] = item.input
+    })
+    const res = await flowAction({
+      action: nodeAction.value,
+      payload: obj
+    })
+    if (res.code === 200) {
+      ElMessage.success('执行成功')
+    } else {
+      ElMessage.error(res.msg)
+    }
+  }
 }
 
 onMounted(() => {
-  justLoadFlow()
-  initFlow()
-  
-  registerBeforeUnload()
+  justLoadFlow();
+  initFlow();
+  document.addEventListener("singleNodeExecution", singleNodeExecution);
+  registerBeforeUnload();
 });
 
 const operationEdge = (arr) => {
-  arr.forEach(item => {
-    newEdge(item.id)
-  })
-}
+  arr.forEach((item) => {
+    newEdge(item.id);
+  });
+};
 
 onUnmounted(() => {
-  emitter.off('changeNodeState');
-  window.removeEventListener('beforeunload', handleBeforeUnload)
-})
+  emitter.off("changeNodeState");
+  window.removeEventListener("beforeunload", handleBeforeUnload);
+  document.removeEventListener("singleNodeExecution", singleNodeExecution);
+});
 </script>
 <style lang="scss" scoped>
 .page {
@@ -606,7 +785,7 @@ onUnmounted(() => {
   .page__container {
     width: 100%;
     height: 100%;
-    position: relative; 
+    position: relative;
 
     .el-header {
       display: flex;
@@ -647,10 +826,9 @@ onUnmounted(() => {
         }
 
         .lf-node-content {
-
           .lf-node-anchor {
             display: block !important; /* 强制显示 */
-            opacity: 1 !important;     /* 取消透明度 */
+            opacity: 1 !important; /* 取消透明度 */
           }
         }
 
@@ -671,6 +849,8 @@ onUnmounted(() => {
     }
   }
 }
+
+
 </style>
 <style lang="scss">
 .node-relationship-network-popover {
@@ -694,4 +874,18 @@ onUnmounted(() => {
     overflow-y: auto;
   }
 }
+
+.el-dialog {
+    .el-input {
+      width: 200px;
+    }
+
+    .el-select {
+      width: 200px;
+    }
+
+    .el-textarea {
+      width: 200px
+    }
+}
 </style>
diff --git a/src/views/flow/nodes/common/serviceNode.vue b/src/views/flow/nodes/common/serviceNode.vue
index d907976..3fa852d 100644
--- a/src/views/flow/nodes/common/serviceNode.vue
+++ b/src/views/flow/nodes/common/serviceNode.vue
@@ -34,6 +34,7 @@
       :icon="props.properties.icon"
       :nodeId="props.model.id"
       :nodeProperties="props.properties"
+      :nodeType="props.properties.nodeType || 'NONE'"
       :nodeName="props.properties.name"
       :nodeDesc="props.properties.desc"
       :zoom-state="nodeZoom"
diff --git a/src/views/flow/nodes/common/startNode.vue b/src/views/flow/nodes/common/startNode.vue
index 23debd8..e593359 100644
--- a/src/views/flow/nodes/common/startNode.vue
+++ b/src/views/flow/nodes/common/startNode.vue
@@ -23,7 +23,7 @@
             :content="nodeZoom ? '缩小' : '放大'"
             placement="top"
           >
-            <el-button circle size="small" @click="zoom">
+            <el-button circle @click="zoom">
               <el-icon>
                 <ZoomOut v-if="nodeZoom" />
                 <ZoomIn v-else />
@@ -262,6 +262,13 @@ defineExpose({
           margin-left: 12px;
         }
       }
+
+      .right {
+        .el-button {
+          border: none;
+          font-size: 24px;
+        }
+      }
     }
 
     .subTitle {